js代码_js特效免费下载_JS特效代码网   网页特效   鼠标特效   js图片相册   js特效代码大全
当前位置:首页 > 网页特效 > JS常用代码 > 鼠标特效

jquery 水平手风琴鼠标滑过标题图片滑动切换特效

发布时间:2015-08-30 20:13:33    您是第0位浏览者

本js特效代码兼容:ie6 、ie7 、ie8 、ie9 、ie10 、ie11 、chrome 、firefox 、opera 、safari 、 等浏览器

jquery 水平手风琴鼠标滑过标题图片滑动切换特效
$(document).ready(function(){
	var movetime=500;	
	var maxw=252;
	var avgw= parseInt((1130-maxw-2)/11);	
	var index;
	var t=false; //延时执行
	var _this;

	//标记当前
	function cur(ele){		
		ele=$(ele)? $(ele):ele;
		ele.addClass("cur").siblings().removeClass("cur");	
	};
	
	$("#picon li:eq(0)").addClass("cur").animate({"width":maxw+"px"});
	
	$("#picon").find("li").mouseover(function(){									  
		_this=$(this);		
		index=$( "#picon li" ).index( $(this)[0] );
		var act=function (){
			_this.siblings("li").removeClass("cur");
			_this.animate({"width":maxw+"px"},{duration:movetime,easing:"easeOutQuart",complete:function(){cur(_this)}}).siblings("li").animate({"width":avgw+"px"},{duration:movetime})
		}
		t=setTimeout(act,200);			
		return false;			
	}).mouseout(function(){
		if(t){
			clearTimeout(t);
		}
	});

});	



jquery 手风琴 图片

jQuery左侧分类导航特效_jquery商城左侧分类菜单导航_橙色导航菜单特效代码

jquery选项卡切换,版块鼠标跟随边框变色特效

jquery带缩略图焦点滚动图特效代码

仿红木之家官网首页jquery焦点全屏大图切换特效

jQuery二级图文平滑下拉菜单特效代码

jquery顶部导航菜单下拉,左侧分类切换特效

jQuery实现固定顶部导航,点触全屏滚动特效代码

jQuery仿腾讯云全屏下拉导航菜单特效代码

一款jQuery跨平台并且带触摸移动端焦点图特效

jQuery四屏焦点图网站特效代码

jquery双重切换的tab选项卡特效代码

jquery仿360音乐搜索主页歌手切换选项卡特效

jquery tab选项卡插件支持鼠标滑过、点击、自动切换、数据回调等特效

jquery SuperSlide仿京东首页促销产品tab选项卡切换特效

jquery图片相册特效,切换上下页,还带对话框提醒特效

jquery实现右下角浮动返回顶部并且带微信二维码特效

jquery实现带微信二维码,qq客服,联系电话的返回顶部特效

jQuery右侧浮动客服特效,点击弹出窗口显示更多在线QQ客服

仿OPPO官方商城jquery焦点图特效

jquery绿色的按栏目下拉,信息搜索输入框特效代码

jquery右侧在线QQ客服手风琴特效

js实现AnG无双科技首页,手风琴特效

CSS3实现手风琴叠加图片自动轮播特效

jquery实现支持响应的TAB手风琴特效代码

jquery仿艺龙旅行网图片手风琴特效

jQuery实现扁平化手风琴banner特效代码

jQuery横向手风琴菜单特效代码