Jquery淡入透明条缩略图广告图

查看演示 下载资源 下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

载入css+js

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

<script type="text/javascript" src="js/jquery.1.4.4.js"></script>
<script type="text/javascript" src="js/script.js"></script>

html代码

<div id="home_banner">

	<a id="big_a"><div id="big_img"></div></a>
	
	<div class="relative">
		<div id="small_img">
			<div class="maxwidth">
				<a id="small_pre"><</a>
				<div id="small_imgs">
					<a href="javascript:;" class="item"><div class="img" b="images/01.jpg" l="" theid="69"> <img src="images/01.jpg"/></div></a>
					<a href="javascript:;" class="item"><div class="img" b="images/02.jpg" l="" theid="69"> <img src="images/02.jpg"/></div></a>
					<a href="javascript:;" class="item"><div class="img" b="images/03.jpg" l="" theid="69"> <img src="images/03.jpg"/></div></a>
					<a href="javascript:;" class="item"><div class="img" b="images/04.jpg" l="" theid="69"> <img src="images/04.jpg"/></div></a>
					<a href="javascript:;" class="item"><div class="img" b="images/05.jpg" l="" theid="69"> <img src="images/05.jpg"/></div></a>
				</div>
				<a id="small_next">></a>
			</div>
		</div>
	</div>
	
</div>

原理很简单，更换#big_img 的background的值