Collapse content [closed] - Read For Learn

Solved this.

I created a plugin which loads this js:

function showContent(element){
   $('.huisjes').slideUp();
   if ( $(element).is( ':hidden' ) ) {
     $(element).slideDown('slow');
   } else {
     $( element).slideUp();
   }
}

Then I created two shortcodes:

function createDiv($atts, $content = null) {
   extract(shortcode_atts(array(
      'id' => "",
   ), $atts));
return '<div id="'. $id . '" class="huisjes"  style="display:none;"/>' . $content . '</div>';
}
add_shortcode('huisje', 'createDiv');

function createButton($atts, $content = null) {
   extract(shortcode_atts(array(
       'id' => "",
   ), $atts));
return '<a onClick="showContent('.$id.')" href="https://wordpress.stackexchange.com/questions/286800/javascript:void(0);" class="big-button bigorange">'. $content .'</a>';
}
add_shortcode('huisje_button', 'createButton');

The first code creates an div with the given ID. The second code creates a button (with some css) which links to the function in the JS to show the content.

Related Posts: