博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
各种效果的tab选项卡
阅读量:6515 次
发布时间:2019-06-24

本文共 2809 字,大约阅读时间需要 9 分钟。

;(function($){
$.fn.tabso=function( options ){
var opts=$.extend({},$.fn.tabso.defaults,options ); return this.each(function(i){
var _this=$(this); var $menus=_this.children( opts.menuChildSel ); var $container=$( opts.cntSelect ).eq(i); if( !$container) return; if( opts.tabStyle=="move"||opts.tabStyle=="move-fade"||opts.tabStyle=="move-animate" ){
var step=0; if( opts.direction=="left"){
step=$container.children().children( opts.cntChildSel ).outerWidth(true); }else{
step=$container.children().children( opts.cntChildSel ).outerHeight(true); } } if( opts.tabStyle=="move-animate" ){ var animateArgu=new Object(); } $menus[ opts.tabEvent]( function(){
var index=$menus.index( $(this) ); $( this).addClass( opts.onStyle ) .siblings().removeClass( opts.onStyle ); switch( opts.tabStyle ){
case "fade": if( !($container.children( opts.cntChildSel ).eq( index ).is(":animated")) ){
$container.children( opts.cntChildSel ).eq( index ).siblings().css( "display", "none") .end().stop( true, true ).fadeIn( opts.aniSpeed ); } break; case "move": $container.children( opts.cntChildSel ).css(opts.direction,-step*index+"px"); break; case "move-fade": if( $container.children( opts.cntChildSel ).css(opts.direction)==-step*index+"px" ) break; $container.children( opts.cntChildSel ).stop(true).css("opacity",0).css(opts.direction,-step*index+"px").animate( {"opacity":1},opts.aniSpeed ); break; case "move-animate": animateArgu[opts.direction]=-step*index+"px"; $container.children( opts.cntChildSel ).stop(true).animate( animateArgu,opts.aniSpeed,opts.aniMethod ); break; default: $container.children( opts.cntChildSel ).eq( index ).css( "display", "block") .siblings().css( "display","none" ); } }); $menus.eq(0)[ opts.tabEvent ](); }); }; $.fn.tabso.defaults={
cntSelect : ".content_wrap", tabEvent : "mouseover_on", tabStyle : "normal", direction : "top", aniMethod : "swing", aniSpeed : "fast", onStyle : "current", menuChildSel : "*", cntChildSel : "*" }; })(jQuery);
  • 借物 [3]
  • 售卖其他产品
  • 发票信息
 

转载于:https://www.cnblogs.com/chongtao/p/5843321.html

你可能感兴趣的文章
《PHP和MySQL Web 开发》 第12章 MySQL高级管理
查看>>
数据库设计 Step by Step (6) —— 提取业务规则
查看>>
Redis客户端redisson实战
查看>>
连接到 JasperReports Server
查看>>
java处理高并发高负载类网站问题
查看>>
使用C#生成随机密码(纯数字或字母)和随机卡号(数字与字母组合)
查看>>
CAS服务器端集群
查看>>
JAVA Collections框架
查看>>
进制转换
查看>>
ASCII码
查看>>
java常用四种排序源代码
查看>>
win7 下硬盘安装Redhat7
查看>>
Redis 分布式锁的正确实现方式
查看>>
mysqldump 备份命令使用中的一些经验总结
查看>>
程序猿知道英语词汇
查看>>
数据存储(两)--SAX发动机XML记忆(附Demo)
查看>>
谈谈SQL 语句的优化技术
查看>>
ecshop如何判断缓存文件是否能更新
查看>>
javascript于boolean类型转换,运营商&&和|| 返回值
查看>>
深入分析面向对象中的封装作用
查看>>