jQuery图片轮播特效

效果预览:http://hovertree.com/texiao/jquery/51/这款特效有缩略图,包含文字说明和链接,可以自动播放,也可以手动切换。使用的jQuery库版本为1.12.3,

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

效果预览:http://hovertree.com/texiao/jquery/51/

这款特效有缩略图,包含文字说明和链接,可以自动播放,也可以手动切换。

使用的jQuery库版本为1.12.3 ,当然项1.11.1等也是可以的。下载地址:http://hovertree.com/h/bjaf/ati6k7yk.htm

效果图:
jQuery图片轮播特效

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery适合风景展现幻灯片代码 - 何问起</title><base target="_blank" />
<link rel="stylesheet" type="text/css" href="http://hovertree.com/texiao/jquery/51/images/index.css">
<script type="text/javascript" src="http://down.hovertree.com/jquery/jquery-1.12.3.min.js"></script>
<script type="text/javascript" src="http://hovertree.com/texiao/jquery/51/js/jquery.slides.js"></script>

</head>
<body>
<div style="text-align:center;"><h1>jQuery带缩略图的图片切换</h1></div>
<div id="yxh_article">
<div class="slider_box" id="slider_name"> 

<div class="mask"></div>

<ul class="silder_con">    

<li class="silder_panel"><a href="http://hovertree.com/h/bjaf/41eyinh2.htm" class="f_l"><img src="http://hovertree.com/hvtimg/bjafjd/uqa9cu66.jpg" width="600" height="375" /></a></li> 
<li class="silder_panel"><a href="http://hovertree.com/texiao/game/" class="f_l"><img src="http://hovertree.com/hvtimg/bjafjd/2m6dep2i.jpg" width="600" height="375" /></a></li>
<li class="silder_panel"><a href="http://hovertree.com/h/bjaf/c7lmaqjx.htm" class="f_l"><img src="http://hovertree.com/hvtimg/bjafjd/rrlmyu1g.jpg" width="600" height="375" /></a></li>
<li class="silder_panel"><a href="http://hovertree.com/h/bjaf/hwqtjwjs.htm" class="f_l"><img src="http://hovertree.com/hvtimg/bjafjd/81q15f9j.jpg" width="600" height="375" /></a></li>


</ul>    
<div class="silder_intro">
<h3>荷叶</h3>
</div>
<div class="silder_intro">
<h3>内衣</h3>
</div>

<div class="silder_intro">
<h3>沙滩</h3>
</div>

<div class="silder_intro">
<h3>大海</h3>
</div>


<ul class="silder_nav dec"> 
<li><a href="http://hovertree.com/h/bjaf/41eyinh2.htm"><img src="http://hovertree.com/hvtimg/bjafjd/uqa9cu66.jpg" width="110" height="48" /></a></li>
<li><a href="http://hovertree.com/texiao/game/"><img src="http://hovertree.com/hvtimg/bjafjd/2m6dep2i.jpg" width="110" height="48" /></a></li>
<li><a href="http://hovertree.com/h/bjaf/c7lmaqjx.htm"><img src="http://hovertree.com/hvtimg/bjafjd/rrlmyu1g.jpg" width="110" height="48" /></a></li>
<li><a href="http://hovertree.com/h/bjaf/hwqtjwjs.htm"><img src="http://hovertree.com/hvtimg/bjafjd/81q15f9j.jpg" width="110" height="48" /></a></li> 
</ul>
</div>

</div> 

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p>
<p>来源:<a href="http://hovertree.com/">何问起</a> <a href="http://hovertree.com/texiao/">特效</a> <a href="http://hovertree.com/h/bjaf/picqiehuan.htm">原文</a></p>
</div>
</body>
</html>

转自:http://hovertree.com/h/bjaf/picqiehuan.htm

推荐:http://hovertree.com/texiao/jquery/53/

更多特效:http://www.cnblogs.com/roucheng/p/texiao.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/120613.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 一般运维架构图「建议收藏」

    一般运维架构图「建议收藏」架构图:整体架构如架构图所示,client端请求通过域名解析访问到服务端负载均衡器slb或者nginx(静态内容存储在阿里云oss并通过cnd加速访问),然后经过安全组过滤,请求最终到达server端,经过业务处理并在阿里云数据库RDS读写数据后返回客户端…

    2022年7月17日
    37
  • ubuntu下安装python3

    ubuntu下安装python3安装步骤ubuntu本身安装的时候已经自带python了,在终端输入python-V查看当前python版本python-V如上图,当前电脑安装的python版本是2.7.12下载最新的python3sudoapt-getinstallpython3如图,我的电脑本身已经装有python3了,如果没安装有,则应该安装最

    2022年6月23日
    47
  • 无刷直流电机模糊PID控制「建议收藏」

    无刷直流电机在克服了有刷直流电机机械换相缺点的同时,又具有结构简单、运行可靠以及调速性能好等优点,在很多领域中得到了广泛的应用。本次课题阐述了无刷直流电机的基本结构、运行原理和数学模型,并以无刷直流电机为被控对象,根据电机的特点和控制要求确定了三闭环控制策略,分别是位置、转速及电流环控制三者之间实行串级连接。采用模糊PID控制理论,搭建无刷直流电机和控制器的仿真模型来验证电机控制策略的可行性,使要能使伺服控制器的具体性能满足:无静差,响应快,超调量小的设计要求。结合三闭环控制结构的特点,在位置环中采用模

    2022年4月16日
    69
  • Source insight 3572安装和版本号An invalid source insight serial number was detected解

    Source insight 3572安装和版本号An invalid source insight serial number was detected解

    2022年1月4日
    57
  • fastclick干什么用的_fast对旅游的作用

    fastclick干什么用的_fast对旅游的作用fastclick是具有消除移动端浏览器上的点击事件的300ms的延迟的作用。注意几点1、PC端无效2、Android上的Chrome32+浏览器,如果在 viewpor

    2022年8月6日
    8
  • Java反射访问私有成员

    Java反射访问私有成员

    2022年3月12日
    52

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号