jquery插件orbit.js实现图片折叠轮换特效


Posted in Javascript onApril 14, 2015

jQuery图片折叠轮换代码,可以点击左右箭头按钮切换图片,漂亮简洁。兼容主流浏览器,phplearn初学者推荐下载!

使用方法:
1、head区域引用文件 jquery.min.js,chuxz.css
2、在文件中加入<!-- 代码 开始 --><!-- 代码 结束 -->区域代码
3、在页面底部引用jq.orbit.js.js, orbit.js
4、复制images文件夹里的图片到相应的路径

<div class="orbit-wrapper">       
  <div id="featured" class="orbit">  
    <a href="http://www.phplearn.cn/"><img src="images/1.jpg" width="185" alt="《Just Married》" title="《Just Married》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/2.jpg" width="185" alt="《佩加索斯》" title="《佩加索斯》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/3.jpg" width="185" alt="《太庙的一场偶遇》" title="《太庙的一场偶遇》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/4.jpg" width="185" alt="《为爱痴狂》" title="《为爱痴狂》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/5.jpg" width="185" alt="《游走,在北京的每一条街》" title="《游走,在北京的每一条街》"></a>  
  </div>  
</div>  
<script type="text/javascript" src="js/jq.orbit.js"></script>  
<script type="text/javascript" src="js/orbit.js"></script>

演示图:

jquery插件orbit.js实现图片折叠轮换特效  

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
jQuery JSON实现无刷新三级联动实例探讨
May 28 Javascript
把字符串按照特定的字母顺序进行排序的js代码
Jan 28 Javascript
javascript中的previousSibling和nextSibling的正确用法
Sep 16 Javascript
关于JS中match() 和 exec() 返回值和属性的测试
Mar 21 Javascript
Bootstrap实现弹性搜索框
Jul 11 Javascript
利用JS屏蔽页面中的Enter按键提交表单的方法
Nov 25 Javascript
jQuery在header中设置请求信息的方法
Mar 06 Javascript
浅谈react-router HashRouter和BrowserRouter的使用
Dec 29 Javascript
vue数据初始化initState的实例详解
Apr 11 Javascript
Angular实现svg和png图片下载实现
May 05 Javascript
JS+CSS实现随机点名(实例代码)
Nov 04 Javascript
用vue写一个日历
Nov 02 Javascript
jQuery遍历页面所有CheckBox查看是否被选中的方法
Apr 14 #Javascript
jquery+html5制作超酷的圆盘时钟表
Apr 14 #Javascript
JavaScript将字符串转换为整数的方法
Apr 14 #Javascript
使用javascript实现判断当前浏览器
Apr 14 #Javascript
jQuery获得指定元素坐标的方法
Apr 14 #Javascript
JavaScript时间转换处理函数
Apr 14 #Javascript
JavaScript整除运算函数ceil和floor的区别分析
Apr 14 #Javascript
You might like
php 什么是PEAR?(第二篇)
2009/03/19 PHP
PHP操作mysql函数详解,mysql和php交互函数
2011/05/19 PHP
探讨:如何使用PHP实现计算两个日期间隔的年、月、周、日数
2013/06/13 PHP
php实现的DateDiff和DateAdd时间函数代码分享
2014/08/16 PHP
PHP中exec与system用法区别分析
2014/09/22 PHP
ecshop 2.72如何修改后台访问地址
2015/03/03 PHP
jquery 输入框数字限制插件
2009/11/10 Javascript
改写一个简单的菜单 弹性大小
2010/12/02 Javascript
js中的屏蔽的使用示例
2013/07/30 Javascript
js带按钮的提示框可供选择示例代码
2013/09/17 Javascript
jquery中获取id值方法小结
2013/09/22 Javascript
ListBox实现上移,下移,左移,右移的简单实例
2014/02/13 Javascript
分享10个优化代码的CSS和JavaScript工具
2016/05/11 Javascript
js中DOM三级列表(代码分享)
2017/03/20 Javascript
Vue原理剖析 实现双向绑定MVVM
2017/05/03 Javascript
JS实现队列的先进先出功能示例
2017/05/10 Javascript
Vue项目中quill-editor带样式编辑器的使用方法
2017/08/08 Javascript
jQuery事件对象的属性和方法详解
2017/09/09 jQuery
Angular4的输入属性与输出属性实例详解
2017/11/29 Javascript
layui实现数据表格自定义数据项
2019/10/26 Javascript
jQuery HTML css()方法与css类实例详解
2020/05/20 jQuery
Node.js fs模块原理及常见用途
2020/10/22 Javascript
[20:30]职业巡回赛回顾
2018/08/09 DOTA
用Python编写生成树状结构的文件目录的脚本的教程
2015/05/04 Python
Python 文件处理注意事项总结
2017/04/10 Python
Python OpenCV利用笔记本摄像头实现人脸检测
2020/08/20 Python
PyCharm安装Markdown插件的两种方法
2019/06/24 Python
Python中logging日志记录到文件及自动分割的操作代码
2020/08/05 Python
python向企业微信发送文字和图片消息的示例
2020/09/28 Python
Asics日本官网:鬼冢八喜郎创立的跑鞋运动品牌
2017/10/18 全球购物
英国在线花园中心:You Garden
2018/06/03 全球购物
安全生产责任书范本
2014/04/15 职场文书
国庆节活动总结
2014/08/26 职场文书
2015年公务员个人工作总结
2015/04/24 职场文书
质检员工作总结2015
2015/04/25 职场文书
本地搭建minio文件服务器(使用bat脚本启动)的方法
2022/07/15 Servers