首页 > 图片特效 / jquery特效插件 / > 时尚jQuery图片幻灯片特效插件desSlideshow

时尚jQuery图片幻灯片特效插件desSlideshow

点击: 3578 , 发布日期: 2012-2-8
时尚jQuery图片幻灯片特效插件desSlideshow

时尚jQuery图片幻灯片特效插件desSlideshow

一个不错的jquery图片幻灯片切换特效插件,切换点以TAB选项卡样式排列在右侧,鼠标移上去时突出显示当然选项卡同时切换图片。

HTML代码:

<div id="desSlideshow" class="desSlideshow">
<div class="switchBigPic">
<div>
<a title="" href="#"><img class="pic" src="./images/006.jpg" /></a>
<p><strong>Description Title1</strong><br/>
Description Content1
</p>
</div>
<div><a title="" href="#"><img class="pic" src="./images/004.jpg" /></a>
</div>
<div><a title="" href="#"><img class="pic" src="./images/001.jpg" /></a>
<p><strong>Description Title3</strong><br/>
Description Content3
</p>
</div>
<div><a title="" href="#"><img class="pic" src="./images/003.jpg" /></a>
<p><strong>Description Title4</strong><br/>
Description Content4
</p>
</div>
</div>
<ul class="nav">
<li><a href="#">Slideshow1</a></li>
<li><a href="#">Slideshow2</a></li>
<li><a href="#">Slideshow3</a></li>
<li><a href="#">Slideshow4</a></li>
</ul>
</div>

 

jquery代码与参数说明:

<script language="javascript" type="text/javascript">
$(function() {
$("#desSlideshow").desSlideshow({
autoplay: 'enable',//option:enable,disable
slideshow_width: '800',//slideshow window width
slideshow_height: '249',//slideshow window height
thumbnail_width: '200',//thumbnail width
time_Interval: '4000',//Milliseconds
directory: 'images/'// flash-on.gif and flashtext-bg.jpg and loading.gif directory
});
});
</script>

 

关键词: jquery+css

注:用QQ登录后即可下载特效,当然你的积分是有限的,望好好利用与赚取!如何获得积分

我要评论
登录再评论
全部评论