jQuery仿爱奇艺广告图片手风琴切换特效

来源:https://www.sucaihuo.com/js/2152.html 2017-06-12 17:35浏览(545) 收藏

jQuery仿爱奇艺广告图片手风琴切换特效,这是仿爱奇艺官网中推广广告效果,图片左右切换加手风琴展开特效。
jQuery仿爱奇艺广告图片手风琴切换特效
分类:图片代码 > 广告 难易:初级
查看演示 下载资源 下载积分: 20 积分

js代码

<script>
		$(function(){
			var lb_cur = 1,
				t = 1;
			function showLimitBuyProducts(){
				if(lb_cur < 1){
					lb_cur = 4;
				}
				else if(lb_cur > 4){
					lb_cur = 1;
				}
				var products = $("#limitbuy .products").hide().eq(lb_cur-1).show(),
					ta = products.find("textarea");
			}
			//左边点击
			$("#tggg_zuojian").click(function(){
				lb_cur--;
				showLimitBuyProducts();
			});
			//右边点击
			$("#tggg_youjian").click(function(){
				lb_cur++;
				showLimitBuyProducts();
			});
			//手风琴样式
			$(".theatre-item").mouseover(function(){
				if($(this).index()==5){
					$(this).addClass('aa');
					$(this).siblings().addClass('bb');
					$(this).siblings().eq(0).removeClass('bb');
					//$('.theatre-item:eq(0)').removeClass('bb');

				}else{
					//console.log($(this).index());//调试jsconsole.log()获取li的下标
					$(this).addClass('aa');
					$(this).siblings().addClass('bb');
					$(this).next().attr('class','theatre-item');
				}
			})
			$(".theatre-item").mouseout(function(){
				$(this).attr('class','theatre-item');
				$(this).siblings().removeClass('bb');
			});
		});
	</script>
评论0
头像

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

1 2