更多>
最新下载
24小时阅读排行榜
- 1 windows11文件无法删除提示被占用怎么解决_windows11文件占用无法删除修复办法
- 2 JavaScript安全漏洞与防护策略
- 3 OPPO A3 WiFi信号弱 OPPO A3网络增强方法
- 4 VSCode的自动保存功能值得开启吗?
- 5 石墨文档如何导入PPT演示文稿_石墨文档演示功能的操作
- 6 fmhy官网快速访问_fmhy中文版官网入口
- 7 win11如何设置电脑永不休眠 win11电脑永不休眠设置方法
- 8 VS Code终极指南:从安装配置到高效工作流实战
- 9 腾讯元宝AI在线试用入口 腾讯元宝网页版快速入口
- 10 html5文件如何实现自定义上传路径 html5文件后端接口的路径参数
- 11 硬件保修政策解读
- 12 PHP数据如何实现文件上传 PHP数据上传功能的完整实现
- 13 拼多多2025双11优惠券怎么领取最全 拼多多优惠活动合集
- 14 无线投屏设置:多设备屏幕共享教程
- 15 Microsoft Teams如何设置文件版本 Microsoft Teams文档管理的控制技巧
更多>
最新教程
-
- Node.js 教程
- 6085 2025-08-28
-
- CSS3 教程
- 897341 2025-08-27
-
- Rust 教程
- 9822 2025-08-27
-
- Vue 教程
- 11966 2025-08-22
-
- PostgreSQL 教程
- 9202 2025-08-21
-
- Git 教程
- 4786 2025-08-21
jQuery+CSS3的分步向导手风琴切换代码
这是一款非常实用简洁的手风琴样式,jQuery+CSS3分步向导手风琴切换代码,按步骤点击展开手风琴效果代码。
js代码
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).load(function(){
$(".done").click(function(){
var this_li_ind = $(this).parent().parent("li").index();
if($('.payment-wizard li').hasClass("jump-here")){
$(this).parent().parent("li").removeClass("active").addClass("completed");
$(this).parent(".wizard-content").slideUp();
$('.payment-wizard li.jump-here').removeClass("jump-here");
}else{
$(this).parent().parent("li").removeClass("active").addClass("completed");
$(this).parent(".wizard-content").slideUp();
$(this).parent().parent("li").next("li:not('.completed')").addClass('active').children('.wizard-content').slideDown();
}
});
$('.payment-wizard li .wizard-heading').click(function(){
if($(this).parent().hasClass('completed')){
var this_li_ind = $(this).parent("li").index();
var li_ind = $('.payment-wizard li.active').index();
if(this_li_ind < li_ind){
$('.payment-wizard li.active').addClass("jump-here");
}
$(this).parent().addClass('active').removeClass('completed');
$(this).siblings('.wizard-content').slideDown();
}
});
})
</script>
js代码
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).load(function(){
$(".done").click(function(){
var this_li_ind = $(this).parent().parent("li").index();
if($('.payment-wizard li').hasClass("jump-here")){
$(this).parent().parent("li").removeClass("active").addClass("completed");
$(this).parent(".wizard-content").slideUp();
$('.payment-wizard li.jump-here').removeClass("jump-here");
}else{
$(this).parent().parent("li").removeClass("active").addClass("completed");
$(this).parent(".wizard-content").slideUp();
$(this).parent().parent("li").next("li:not('.completed')").addClass('active').children('.wizard-content').slideDown();
}
});
$('.payment-wizard li .wizard-heading').click(function(){
if($(this).parent().hasClass('completed')){
var this_li_ind = $(this).parent("li").index();
var li_ind = $('.payment-wizard li.active').index();
if(this_li_ind < li_ind){
$('.payment-wizard li.active').addClass("jump-here");
}
$(this).parent().addClass('active').removeClass('completed');
$(this).siblings('.wizard-content').slideDown();
}
});
})
</script>
本站所有资源都是由网友投搞发布,或转载各大下载站,请自行检测软件的完整性!本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!如有侵权请联系我们删除下架,联系方式:admin@php.cn


