jQuery实现图片左右滚动特效


Posted in Javascript onApril 20, 2020

本文实例讲述了jQuery合作伙伴左右滚动特效,分享给大家供大家参考,具体如下:

一款基于jQuery合作伙伴左右滚动特效代码,是一款带左右箭头及自动滚动友情链接合作伙伴左右滚动网页特效,鼠标滑过停止自动滚动,鼠标离开自动滚动,点击左右按钮左右滚动Logo切换网页特效。可用于网站底部作为合作伙伴展示或友链展示的特效,是一款非常优秀的特效源码。

运行效果图:----------------------查看效果 下载源码-----------------------

jQuery实现图片左右滚动特效

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
为大家分享的jQuery合作伙伴左右滚动特效代码如下

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery合作伙伴左右滚动特效 - 三水点靠木</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.js" language="javascript" type="text/javascript"></script>
<script language="javascript" type="text/javascript" src="js/ss.js"></script>
</head>
<body>
<div style="width:685px; margin:0 auto">
<div class="mr_t1 mt14">
 <div class="mr_t1name">
 <img src="images/mt_ico6.jpg" />合作伙伴
 </div>
</div>
<div class="mr_frbox">
 <img class="mr_frBtnL prev" src="images/mfrL.jpg" width="28" height="46" />
 <div class="mr_frUl">
 <ul>
 <li><a href="//3water.com" target="_blank"><img src="images/mfr_1.jpg" width="123" height="52" /></a><a href="//3water.com" target="_blank"><img src="images/mfr_2.jpg" width="123" height="52" /></a></li>
 <li><a href="//3water.com" target="_blank"><img src="images/mfr_3.jpg" width="123" height="52" /></a><a href="//3water.com" target="_blank"><img src="images/mfr_6.jpg" width="123" height="52" /></a></li>
 <li><a href="//3water.com" target="_blank"><img src="images/mfr_4.jpg" width="123" height="52" /></a><a href="//3water.com" target="_blank"><img src="images/mfr_7.jpg" width="123" height="52" /></a></li>
 <li><a href="//3water.com" target="_blank"><img src="images/mfr_5.jpg" width="123" height="52" /></a><a href="//3water.com" target="_blank"><img src="images/mfr_8.jpg" width="123" height="52" /></a></li>
 </ul>
 </div>
 <img class="mr_frBtnR next" src="images/mfrR.jpg" width="28" height="46" />
</div>
<script language="javascript">
$(".mr_frUl ul li img").hover(function(){$(this).css("border-color","#A0C0EB");},function(){$(this).css("border-color","#d8d8d8")});
jQuery(".mr_frbox").slide({titCell:"",mainCell:".mr_frUl ul",autoPage:true,effect:"leftLoop",autoPlay:true,vis:4});
</script>
</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="//3water.com/" target="_blank">三水点靠木</a></p>
</div>
</body>
</html>

以上就是为大家分享的jQuery合作伙伴左右滚动特效代码,希望大家可以喜欢。

Javascript 相关文章推荐
支持ie与FireFox的剪切板操作代码
Sep 28 Javascript
javascript 文本框水印/占位符(watermark/placeholder)实现方法
Jan 15 Javascript
IE中的File域无法清空使用jQuery重设File域
Apr 24 Javascript
加载列表时jquery获取ul中第一个li的属性
Nov 02 Javascript
input输入框鼠标焦点提示信息
Mar 17 Javascript
JS中使用FormData上传文件、图片的方法
Aug 07 Javascript
Node连接mysql数据库方法介绍
Feb 07 Javascript
ReactJs设置css样式的方法
Jun 08 Javascript
vue中使用element-ui进行表单验证的实例代码
Jun 22 Javascript
又拍云 Node.js 实现文件上传、删除功能
Oct 28 Javascript
webpack file-loader和url-loader的区别
Jan 15 Javascript
openlayers4.6.5实现距离量测和面积量测
Sep 25 Javascript
JS+CSS实现滑动切换tab菜单效果
Aug 25 #Javascript
jquery图片滚动放大代码分享(1)
Aug 25 #Javascript
jquery实现在网页指定区域显示自定义右键菜单效果
Aug 25 #Javascript
jquery实现的3D旋转木马特效代码分享
Aug 25 #Javascript
jQuery+CSS实现的网页二级下滑菜单效果
Aug 25 #Javascript
jQuery实现点击小图显示大图代码分享
Aug 25 #Javascript
基于jquery实现select选择框内容左右移动添加删除代码分享
Aug 25 #Javascript
You might like
php实现微信小程序授权登录功能(实现流程)
2019/11/13 PHP
Js 时间间隔计算的函数(间隔天数)
2011/11/15 Javascript
基于JQuery的一句话搞定手风琴菜单
2012/09/14 Javascript
基于jquery的simpleValidate简易验证插件
2014/01/31 Javascript
jQuery toggleClass应用实例(附效果图)
2014/04/06 Javascript
js实现获取焦点后光标在字符串后
2014/09/17 Javascript
浅谈javascript 函数属性和方法
2015/01/21 Javascript
js+div实现文字滚动和图片切换效果代码
2015/08/27 Javascript
JS实现可关闭的对联广告效果代码
2015/09/14 Javascript
基于javascript实现全屏漂浮广告
2016/03/31 Javascript
js canvas实现擦除动画
2016/07/16 Javascript
jQuery实现最简单的切换图效果【可兼容IE6、火狐、谷歌、opera等】
2016/09/04 Javascript
JS实现微信弹出搜索框 多条件查询功能
2016/12/13 Javascript
iscroll实现下拉刷新功能
2017/07/18 Javascript
基于 D3.js 绘制动态进度条的实例详解
2018/02/26 Javascript
JavaScript实现微信号随机切换代码
2018/03/09 Javascript
详解使用create-react-app添加css modules、sasss和antd
2018/07/31 Javascript
vue踩坑记录之数组定义和赋值问题
2019/03/20 Javascript
解决vue单页面应用打包后相对路径、绝对路径相关问题
2020/08/14 Javascript
React Native登录之指纹登录篇的示例代码
2020/11/03 Javascript
JavaScript实现简单动态表格
2020/12/02 Javascript
Vue 简单实现前端权限控制的示例
2020/12/25 Vue.js
Python模块学习 datetime介绍
2012/08/27 Python
Python读取系统文件夹内所有文件并统计数量的方法
2018/10/23 Python
spark dataframe 将一列展开,把该列所有值都变成新列的方法
2019/01/29 Python
在Python中使用turtle绘制多个同心圆示例
2019/11/23 Python
Pandas-Cookbook 时间戳处理方式
2019/12/07 Python
Python MySQLdb 执行sql语句时的参数传递方式
2020/03/04 Python
Python类及获取对象属性方法解析
2020/06/15 Python
深入了解NumPy 高级索引
2020/07/24 Python
英国最大的百货公司:Harrods
2016/08/18 全球购物
团委书记的竞聘演讲稿
2014/04/24 职场文书
运动会横幅标语
2014/06/17 职场文书
学校师德师风整改方案
2014/10/28 职场文书
员工旷工检讨书
2015/08/15 职场文书
详解MySQL数据库千万级数据查询和存储
2021/05/18 MySQL