jquery slider图片制作带文字遮罩图片轮播切换插件


jquery slider图片制作带文字遮罩图片轮播切换插件
jquery slider图片制作带文字遮罩图片轮播切换插件以及文字遮罩、图片轮播切换等js/jquery网页特效代码下载。

1. 引入CSS

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

2. 引入JS

<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="js/jquery.timers-1.2.js" type="text/javascript"></script>
<script src="js/jquery.dualSlider.0.3.js" type="text/javascript"></script>

3. HTML代码

<div class="carousel">
	<div class="panel">
		<div class="details_wrapper">
			<div class="details">
				<div class="detail">
					<h2 class="Lexia-Bold"><a href="https://www.51qianduan.com/">51前端</a></h2>
					<a href="https://www.51qianduan.com/">51前端</a>
				</div>
				<div class="detail">
					<h2 class="Lexia-Bold"><a href="https://www.51qianduan.com/">51前端</a></h2>
					<a href="https://www.51qianduan.com/">51前端</a>
				</div>
				<div class="detail">
					<h2 class="Lexia-Bold"><a href="https://www.51qianduan.com/">51前端</a></h2>
					<a href="https://www.51qianduan.com/">51前端</a>
				</div>
			</div>
		</div>
		<div class="paging">
			<div id="numbers"></div>
			<a href="javascript:void(0);" class="previous" title="Previous" >Previous</a>
			<a href="javascript:void(0);" class="next" title="Next">Next</a>
		</div>
		<a href="javascript:void(0);" class="play" title="播放">自动播放</a>
		<a href="javascript:void(0);" class="pause" title="暂停">暂停自动播放</a>
	</div><!-- /panel -->
	<div class="backgrounds">
		<div class="item item_1"><img src="images/1.jpg"/></div>
		<div class="item item_2"><img src="images/2.jpg"/></div>
		<div class="item item_3"><img src="images/3.jpg"/></div>
	</div>
</div>

相关推荐

发表评论

相关文章