大气的jQuery图文内容选项卡切换特效

来源:https://www.sucaihuo.com/js/4829.html 2019-10-12 11:47浏览(541) 收藏

大气的jQuery图文内容选项卡切换特效,一款宽屏通栏tab图文选项卡切换展示效果。
大气的jQuery图文内容选项卡切换特效
查看演示 下载资源 下载积分: 30 积分

js代码

<script src="statics/js/jquery.min.js"></script>
<script type="text/javascript">
	$(function(){
		//TAP
		$('ul.yun-solution-list li').click(function(){
			var index = $(this).index();
			$('ul.yun-solution-wrap li').removeClass('current').eq(index).addClass('current');
			$('#yun-arrow-wrap').attr('class','yun-arrow-wrap yun-arrow-current'+(index+1));
		})
		//背景变换
		$('ul.yun-solution-list li').hover(function(){
			var that =$(this);
			var i=0;
			bgChange = setInterval(function (){
				i+=-84
				that.find('div').css('backgroundPositionY',i)						
				if(i<=-2058){
					clearInterval(bgChange);
				}
			},50)
		},function(){
			clearInterval(bgChange);
		})
	})
</script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2