我用jquery + css3创建手风琴菜单一切正常,期待菜单总是打开页面加载和隐藏它不起作用的代码这是我创建的小提琴
这是我的jquery代码
$(document).ready(function() {
//ACCORDION BUTTON ACTION (ON CLICK DO THE FOLLOWING)
$('.zero_menu_title_collapse').click(function() {
//REMOVE THE ON CLASS FROM ALL BUTTONS
$('.zero_menu_title_collapse').removeClass('on');
//NO MATTER WHAT WE CLOSE ALL OPEN SLIDES
$('.zero_menu_content').slideUp('normal');
//IF THE NEXT SLIDE WASN'T OPEN THEN OPEN IT
if($(this).next().is(':hidden') == true) {
//ADD THE ON CLASS TO THE BUTTON
$(this).addClass('on');
//OPEN THE SLIDE
$(this).next().slideDown('normal');
}
});
/*** REMOVE IF MOUSEOVER IS NOT REQUIRED ***/
//ADDS THE .OVER CLASS FROM THE STYLESHEET ON MOUSEOVER
$('.').mouseover(function() {
$(this).addClass('over');
//ON MOUSEOUT REMOVE THE OVER CLASS
}).mouseout(function() {
$(this).removeClass('over');
});
/*** END REMOVE IF MOUSEOVER IS NOT REQUIRED ***/
/********************************************************************************************************************
CLOSES ALL S ON PAGE LOAD
********************************************************************************************************************/
$('.zero_menu_content').hide();
});
Run Code Online (Sandbox Code Playgroud)
这是完全的小提琴
添加此CSS规则以默认隐藏您的手风琴内容:
.zero_menu_content {
display: none;
}
Run Code Online (Sandbox Code Playgroud)
UPD.此版本还将修复代码中的语法错误:
http://jsfiddle.net/dfsq/YU6nZ/15/
我还删除了$('.zero_menu_content').hide();使用CSS解决方案时不需要的内容.
| 归档时间: |
|
| 查看次数: |
78 次 |
| 最近记录: |