js多排图片自动滚动特效代码下载



如需定制开发(网站开发、二次开发)在线咨询,请点击>> QQ:753511799

37 146 49



特效描述:多排图片 自动滚动。js多排图片自动滚动特效代码下载

代码结构

1. 引入CSS

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

2. 引入JS

<script type="text/javascript" src="js/base.js"></script>
<script type="text/javascript" src="js/scrollImg.js"></script>

3. HTML代码

<div class="scrollbox">
	<div class="pic-list">
		<ul class="wrap">
			<li class="picture"><a href="#"><img alt="97站长网" src="img/T1z_LkXfdpXXaGP9rV-164-164.jpg" width="164" height="164" /><em>97站长网</em></a></li>
			<li class="picture"><a href="#"><img alt="请叫我羊驼先生" src="img/T1NTfkXmdoXXaGP9rV-164-164.jpg" width="164" height="164" /><em>请叫我羊驼先生</em></a></li>
			<li class="picture"><a href="#"><img alt="又到一年粽叶香" src="img/T18UnkXn4mXXaGP9rV-164-164.jpg" width="164" height="164" /><em>又到一年粽叶香</em></a></li>
			<li class="picture"><a href="#"><img alt="一毕业就结婚" src="img/T1sUrlXkXhXXaGP9rV-164-164.jpg" width="164" height="164" /><em>一毕业就结婚</em></a></li>
			<li class="picture"><a href="#"><img alt="小资最爱mini窝" src="img/T1jCLgXaBuXXaGP9rV-164-164.jpg" width="164" height="164" /><em>小资最爱mini窝</em></a></li>
			<li class="picture"><a href="#"><img alt="人尽可帽相!" src="img/T1VQjmXjBcXXaGP9rV-164-164.jpg" width="164" height="164" /><em>人尽可帽相!</em></a></li>
			<li class="picture"><a href="#"><img alt="除了二还有爱" src="img/T1HhjmXmJjXXaGP9rV-164-164.jpg" width="164" height="164" /><em>除了二还有爱</em></a></li>
			<li class="picture"><a href="#"><img alt="锋芝恋被曝复合" src="img/T1Sh_mXi0eXXaGP9rV-164-164.jpg" width="164" height="164" /><em>锋芝恋被曝复合</em></a></li>
			<li class="picture"><a href="#"><img alt="夏天别穿背背佳" src="img/T1MdLmXfFfXXaGP9rV-164-164.jpg" width="164" height="164" /><em>夏天别穿背背佳</em></a></li>
			<li class="picture"><a href="#"><img alt="如果真有海角天涯" src="img/T1siLmXkJgXXaGP9rV-164-164.jpg" width="164" height="164" /><em>如果真有海角天涯</em></a></li>        
		</ul>
	</div>
	<div class="pic-list">
		<ul class="wrap">
			<li class="picture"><a href="#"><img alt="当时我就震惊了" src="img/T1BgYlXhFnXXaGP9rV-164-164.jpg" width="164" height="164" /><em>当时我就震惊了</em></a></li>
			<li class="picture"><a href="#"><img alt="糖果色夏日美甲" src="img/T1XrDnXbVaXXaGP9rV-164-164.jpg" width="164" height="164" /><em>糖果色夏日美甲</em></a></li>
			<li class="picture"><a href="#"><img alt="欧美夏日潮搭" src="img/T1sSPmXeJbXXaGP9rV-164-164.jpg" width="164" height="164" /><em>欧美夏日潮搭</em></a></li>
			<li class="picture"><a href="#"><img alt="开心时记得笑" src="img/T1CN2lXcRnXXaGP9rV-164-164.jpg" width="164" height="164" /><em>开心时记得笑</em></a></li>
			<li class="picture"><a href="#"><img alt="夏天最爱睡地毯" src="img/T1nffmXfBhXXaGP9rV-164-164.jpg" width="164" height="164" /><em>夏天最爱睡地毯</em></a></li>
			<li class="picture"><a href="#"><img alt="007裸体冰激凌" src="img/T1t2jlXfVkXXaGP9rV-164-164.jpg" width="164" height="164" /><em>007裸体冰激凌</em></a></li>
			<li class="picture"><a href="#"><img alt="世上最帅100张脸" src="img/T1UWHhXopuXXaGP9rV-164-164.jpg" width="164" height="164" /><em>世上最帅100张脸</em></a></li>
			<li class="picture"><a href="#"><img alt="做没心没肺的一对" src="img/T1Dk2lXfXkXXaGP9rV-164-164.jpg" width="164" height="164" /><em>做没心没肺的一对</em></a></li>
			<li class="picture"><a href="#"><img alt="我的宠物叫笑笑" src="img/T1UyrmXhxbXXaGP9rV-164-164.jpg" width="164" height="164" /><em>我的宠物叫笑笑</em></a></li>
			<li class="picture"><a href="#"><img alt="烟雨江南几时休" src="img/T1DfzmXj4hXXaGP9rV-164-164.jpg" width="164" height="164" /><em>烟雨江南几时休</em></a></li>    
		</ul>
	</div>
	<div class="pic-list">
		<ul class="wrap">
			<li class="picture"><a href="#"><img alt="有处仙境叫希腊" src="img/T1vWLlXlRqXXaGP9rV-164-164.jpg" width="164" height="164" /><em>有处仙境叫希腊</em></a></li>
			<li class="picture"><a href="#"><img alt="甜蜜情侣街头装" src="img/T1nyYlXflnXXaGP9rV-164-164.jpg" width="164" height="164" /><em>甜蜜情侣街头装</em></a></li>
			<li class="picture"><a href="#"><img alt="晃晃悠悠梦一场" src="img/T1UOrlXg0nXXaGP9rV-164-164.jpg" width="164" height="164" /><em>晃晃悠悠梦一场</em></a></li>
			<li class="picture"><a href="#"><img alt="我是水果店捡来的" src="img/T1x4TmXcxfXXaGP9rV-164-164.jpg" width="164" height="164" /><em>我是水果店捡来的</em></a></li>
			<li class="picture"><a href="#"><img alt="贾斯汀携子走红毯" src="img/T1VFPlXXVrXXaGP9rV-164-164.jpg" width="164" height="164" /><em>贾斯汀携子走红毯</em></a></li>
			<li class="picture"><a href="#"><img alt="花朵草编休闲包" src="img/T1Z0zmXnFeXXaGP9rV-164-164.jpg" width="164" height="164" /><em>花朵草编休闲包</em></a></li>
			<li class="picture"><a href="#"><img alt="你是我的眼!" src="img/T1upLmXadiXXaGP9rV-164-164.jpg" width="164" height="164" /><em>你是我的眼!</em></a></li>
			<li class="picture"><a href="#"><img alt="百变发型DIY" src="img/T1j2HlXkRkXXaGP9rV-164-164.jpg" width="164" height="164" /><em>百变发型DIY</em></a></li>
			<li class="picture"><a href="#"><img alt="褪了色的一个梦" src="img/T1SmYgXeRwXXaGP9rV-164-164.jpg" width="164" height="164" /><em>褪了色的一个梦</em></a></li>
			<li class="picture"><a href="#"><img alt="俏丽流行爆美鞋" src="img/T120_mXgdfXXaGP9rV-164-164.jpg" width="164" height="164" /><em>俏丽流行爆美鞋</em></a></li>       
		</ul>
	</div>
</div> 



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滚动导航菜单 滚动切换 图片滚动 文字滚动 图片文字滚动 全屏滚动 页面滚动 滚动流动 自动滚动图片轮播

×
×
51前端

注册

×
绑定手机

请绑定手机号,在继续操作

×
单次下载支付

应付金额:279

支付完成后,回到下载页面,在进行下载

官方QQ群
意见反馈
qq群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到