Question

当您点击http://kaye.at/test/上的月份时，div显示/隐藏。

当页面加载时，它们都是打开的，我该怎么做才能让June打开但其他页面在页面加载时关闭？

或者如何在页面加载时关闭它们？

JS：

$(document).ready(function(){


$('.show_hide').showHide({           
    speed: 1000,    
    easing: '',
    changeText: 0,
    showText: 'View',
    hideText: 'Close'

}); 


});

HTML：

 <a href="#" class="show_hide" rel="#slidingDiv">View</a><br />
 <div id="slidingDiv">
    Fill this space with really interesting content.
 </div>



 <a href="#" class="show_hide" rel="#slidingDiv_2">View</a><br />
 <div id="slidingDiv_2">
    Fill this space with really interesting content.
 </div>

Answer 1

选择所有容器，排除6月份的容器（编号3），隐藏其余容器？

$('[id^="slidingDiv_"]').not('#slidingDiv_3').hide();

更好的选择是给他们所有类，用CSS隐藏它们，只显示ID为#slidingDiv_3的那个！

<div id="slidingDiv" class="slidingDivs">
    Fill this space with really interesting content.
</div>

的CSS：

 #slidingDiv_3 {display:block;}
.slidingDivs  {display:none;}

Answer 2

添加一个类：display:none;，如下所示：

.class1{
 //your styling
  display:none;
}

等

这样当你点击它时显示：将被设置为display:block;（或你的显示器是什么）

Answer 3

为什么不在浏览器中加载文档时尝试使用slideToggle。

 $(document).ready(function() {
      $('#slidingDiv').slideToggle(options.speed, options.easing)
      $('#slidingDiv_2').slideToggle(options.speed, options.easing)
    });

显示/隐藏DIV脚本

3 个答案: