jquery+SuperSlide仿迅雷小图大图切换轮播插件


jquery+SuperSlide仿迅雷小图大图切换轮播插件
jquery+SuperSlide仿迅雷小图大图切换轮播插件以及小图大图、切换轮播等js/jquery网页特效代码下载。

1. 引入CSS

<link rel="stylesheet" href="css/style.css" />

2. 引入JS

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.js"></script>

3. HTML代码

<div class="foucebox">
	<div class="bd">
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>One Direction的《Kiss You》MV首播,在提前曝光的花絮中,1D的五位正太在《Kiss You》中裸身玩冲浪,吊足胃口啦!</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>2012年来自欧美地区排名前40的sexyMV合集。</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>韩国性感女歌手Sori时隔两年发行的新曲《Dual Life》MV出炉。在MV中她展现了雄厚的舞蹈基础,更是有高难度的托举旋转动作,与舞曲的配合也是淋漓尽致!来一起欣赏韩流音乐新年性感弹第一曲吧!</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>由东海、始源、厉旭、圭贤、Henry、周觅、银赫、晟敏组成的Super Junior的华语圈小分队Super Junior-M正式推出第二张正规专辑《Break Down》,展开全新活动。</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>电影音乐是电影的重要组成部分,当你听到一段音乐的时候也许会想起一部经典的电影,这就是电影音乐的魅力。一首好的电影音乐,对整个影片起着至关重要的作用。通常一部电影会由多首音乐相衬,以更好的衬托出电影需要表现的内容。</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>神马!江南style才排16!小编最爱的T妞40名开外!你钟爱的idol在年榜里排多少自己来看吧!!2012韩流金曲全包括,这也是MV收集控们查漏补缺的利器啊!这么多帅哥美女美颜美腿表示淡定不能了,来一起跟小编喷鼻血吧!!!</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>少女时代的新专辑主打歌《I Got a Boy》完整版大公开!这首主打曲由韩国和欧洲顶尖作曲家打造,从推出前开始就受到音乐粉丝的高度期待。绝对靓丽的色彩搭配和帅气的编舞,给你不一样的惊喜!</p>
			</div>
		</div>
		<div class="showDiv">
			<a href="https://www.51qianduan.com/">51前端</a>
			<div class="foucebox_bg"></div>
			<div>
				<h2><a href="https://www.51qianduan.com/">51前端</a></h2>
				<p>英伦天团Blue再次扬帆起航,从新单《Hurt Lovers》已能窥见全新大碟的冰山一角。新单整体感觉大气磅礴,由Duncan略带沙哑的磁性嗓音带入,随后Lee的高音将爱的刺痛感展现得淋漓尽致四人完美的和声如蓄势已久。</p>
			</div>
		</div>
	</div>
	<div class="hd">
		<ul>
			<li class="on">
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
			<li>
				<a href="https://www.51qianduan.com/">51前端</a>
			</li>
		</ul>
	</div>
</div>
<div style="width:950px;margin:20px auto;font-size:16px;background:#fff;padding:10px;">更多演示下载查看:<a href="https://www.51qianduan.com/">51前端</a></div>
<script type="text/javascript">
$(document).ready(function(){
	$(".foucebox").slide({
		effect:"fold",
		autoPlay:true,
		delayTime:300,
		startFun:function(i){
			$(".foucebox .showDiv").eq(i).find("h2").css({display:"none",bottom:0}).animate({opacity:"show",bottom:"60px"},300);
			$(".foucebox .showDiv").eq(i).find("p").css({display:"none",bottom:0}).animate({opacity:"show",bottom:"10px"},300);
		}
	});
});
</script>

相关推荐

发表评论

相关文章