Edit in JSFiddle

$(document).ready(function(){ 
$('.imHTMLObject').css({ 
'height': '100%', 
'overflow': 'visible' 
}); 
}); 


(function ($) {
    $.fn.showHide = function (options) {
 
    //default vars for the plugin
        var defaults = {
            speed: 1000,
            easing: '',
            changeText: 0,
            showText: 'Show',
            hideText: 'Hide'
 
        };
        var options = $.extend(defaults, options);
 
        $(this).click(function () {
// optionally add the class .toggleDiv to each div you want to automatically close
                      $('.toggleDiv').slideUp(options.speed, options.easing);
             // this var stores which button you've clicked
             var toggleClick = $(this);
             // this reads the rel attribute of the button to determine which div id to toggle
             var toggleDiv = $(this).attr('rel');
             // here we toggle show/hide the correct div at the right speed and using which easing effect
             $(toggleDiv).slideToggle(options.speed, options.easing, function() {
             // this only fires once the animation is completed
             if(options.changeText==1){
             $(toggleDiv).is(":visible") ? toggleClick.text(options.hideText) : toggleClick.text(options.showText);
             }
              });
 
          return false;
 
        });
 
    };
})(jQuery);


$(document).ready(function(){
 
   $('.show_hide').showHide({
        speed: 400,  // speed you want the toggle to happen

    });
 
});

<a class="show_hide" href="#" rel="#slidingDiv">1. Der Hintergrund</a>
<div id="slidingDiv" class="toggleDiv">

<h4>Warum Sie ein ....... besuchen sollten </h4>
<p>
Text
</p>
<p>
Text
</p>
<p>
Text
</p>

</div>
<br />

<a class="show_hide" href="#" rel="#slidingDiv_2">2. Die Regeln</a>
<div id="slidingDiv_2" class="toggleDiv" style="display: none;">

<h4>Die Faustregel eines .... </h4>
<p>
text</p>


</div>
<br />

<a class="show_hide" href="#" rel="#slidingDiv_3">3. Das Programm</a>
<div id="slidingDiv_3" class="toggleDiv" style="display: none;">

<h4>Unser ..... </h4>
<p>
Text
</p>
<p>
Text
</p>


</div>
<br />

<a class="show_hide" href="#" rel="#slidingDiv_4">4. Die Bauernhaus</a>
<div id="slidingDiv_4" class="toggleDiv" style="display: none;">hier kommt dein Text rein</div>
<br />

<a class="show_hide" href="#" rel="#slidingDiv_5">5. Die Bedingungen</a>
<div id="slidingDiv_5" class="toggleDiv" style="display: none;">hier kommt dein Text rein</div>
<br />

<a class="show_hide" href="#" rel="#slidingDiv_6">6. Die Daten</a>
<div id="slidingDiv_6" class="toggleDiv" style="display: none;">hier kommt dein Text rein</div>

h4 {
color: #b10325;
font-family: verdana; 
font-size: 18px; 
font-weight: bold;
padding: 3px 0;
text-align:center;
}

p{font-family: verdana; 
font-size: 14px; 
font-weight: bold;
padding:5px 0;
}

a.show_hide:link, .show_hide{background-color:transparent;color:#b10325;text-decoration:underline;font-family: verdana; 
font-size: 18px; 
font-weight: bold; }
a.show_hide:visited{background-color:transparent;color:#b10325;text-decoration:underline;font-family: verdana; 
font-size: 18px; 
font-weight: bold; }
a.show_hide:hover, a.show_hide:active, .show_hide:hover, .show_hide:active{background-color:transparent;color:#b10325;text-decoration:underline;font-family: verdana; 
font-size: 18px; 
font-weight: bold; }



html {background-image: url('http://www.dgs-wochenende.de/style/content.png'); background-position: center top; background-repeat: repeat-y;}