jQuery+CSS3响应式TAB选项卡幻灯片切换代码

jQuery+CSS3响应式TAB选项卡幻灯片切换代码-精品资源网
jQuery+CSS3响应式TAB选项卡幻灯片切换代码
此内容为免费资源,请登录后查看
0
免费资源

jQuery+CSS3响应式TAB选项卡幻灯片切换代码

一款基于jQuery+CSS3实现的响应式TAB选项卡样式幻灯片切换代码,选项卡切换大图幻灯片特效。

js代码

<script src=\"js/jquery-2.1.1.min.js\" type=\"text/javascript\"></script>
<script type=\"text/javascript\">
$(function(){
	$(\'a\').on(\'click\', function(){ return false; }); 

	// set item banner
	$(\'.ts-item\').first().show();
	$(\'.ts-item\').each(function () {
		var $this = $(this),
			_imgSrc  = $this.find(\'.ts-banner img\').attr(\'src\');
	  
		if(_imgSrc)
		$this.css(\'background-image\', \'url(\' + _imgSrc + \')\');
	});

	$(\'.ts-control li\').on(\'click\', function(){
		var  $this = $(this),
			_index = $this.index();

		  $(\"li.is-active\").removeClass(\"is-active\");
		  $(this).addClass(\"is-active\");
	  
		  $(\'.ts-item.is-active\').removeClass(\'is-active\').fadeOut();
		  $(\'.ts-item\').eq(_index).addClass(\'is-active\').fadeIn();
	  
		return false;
	});

	var ww = $(window).width();
});
</script>

© 版权声明
THE END
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容