Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery Slidetoggle - Can't seem to get it to start off Closed?

I am using a jquery slidetoggle on a single page website. I have been trying to figure out where I went wrong in my script but can't seem to resolve this issue. I am trying to get the slide toggle effect to start off closed when the page opens and open/close only on click. Right now, when the page opens each section of the slide toggle is already open :/ Any help would be appreciated.

<script type="text/javascript">
jQuery(function($) {
var openText = 'Open';
var closeText = 'Close';
$('.item-util .more-toggle').toggle(
    function() {
        $(this).html(closeText);
        $(this).parent().siblings('div').slideToggle('slow');
    },
    function() {
        $(this).html(openText);
        var returnTo = $(this).parents('.item');
        $.scrollTo(returnTo, {offset:{top:-150, left:0}, duration:600});
        $(this).parent().siblings('div').slideToggle('slow');
    }
  );
});
</script>

Thanks

like image 738
Adam Avatar asked Dec 03 '22 02:12

Adam


2 Answers

Set the style of the elements you want to start closed as display:none and it should work...

like image 104
ShaneBlake Avatar answered Dec 04 '22 16:12

ShaneBlake


To have it start off as closed you need to set the css to display: none; for the element that you are trying to slide.

like image 35
Catfish Avatar answered Dec 04 '22 15:12

Catfish