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 相关文章推荐
jquery实现将获取的颜色值转换为十六进制形式的方法
Dec 20 Javascript
javaScript实现滚动新闻的方法
Jul 30 Javascript
基于javascript实现仿百度输入框自动匹配功能
Jan 03 Javascript
javascript实现下雪效果【实例代码】
May 03 Javascript
Jquery基础之事件操作详解
Jun 14 Javascript
js中获取jsp表单中radio类型的值简单实例
Aug 15 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
Dec 12 Javascript
ES6新特性之模块Module用法详解
Apr 01 Javascript
Node.js创建HTTP文件服务器的使用示例
May 11 Javascript
ES6中字符串的使用方法扩展
Jun 04 Javascript
JS合并两个数组的3种方法详解
Oct 24 Javascript
Vue组件生命周期运行原理解析
Nov 25 Vue.js
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
解析func_num_args与func_get_args函数的使用
2013/06/24 PHP
php微信开发之图片回复功能
2018/06/14 PHP
在jQuery 1.5中使用deferred对象的代码(翻译)
2011/03/10 Javascript
js实现简单的星级选择器提交效果适用于评论等
2013/10/18 Javascript
最精简的JavaScript实现鼠标拖动效果的方法
2015/05/11 Javascript
JavaScript实现仿淘宝商品购买数量的增减效果
2016/01/22 Javascript
微信小程序实现皮肤功能(夜间模式)
2017/06/18 Javascript
JavaScript学习总结(一) ECMAScript、BOM、DOM(核心、浏览器对象模型与文档对象模型)
2018/01/07 Javascript
Vue的路由动态重定向和导航守卫实例
2018/03/17 Javascript
小程序视频或音频自定义可拖拽进度条的示例代码
2018/09/30 Javascript
vue实现全匹配搜索列表内容
2019/09/26 Javascript
node.js +mongdb实现登录功能
2020/06/18 Javascript
[04:46]2018年度玩家喜爱的电竞媒体-完美盛典
2018/12/16 DOTA
pytyon 带有重复的全排列
2013/08/13 Python
Python3实现连接SQLite数据库的方法
2014/08/23 Python
用Python程序抓取网页的HTML信息的一个小实例
2015/05/02 Python
举例讲解Python中字典的合并值相加与异或对比
2016/06/04 Python
使用DataFrame删除行和列的实例讲解
2018/04/08 Python
Python学习笔记之变量、自定义函数用法示例
2019/05/28 Python
python2和python3实现在图片上加汉字的方法
2019/08/22 Python
如何使用python的ctypes调用医保中心的dll动态库下载医保中心的账单
2020/05/24 Python
Python如何将模块打包并发布
2020/08/30 Python
CSS3 实现侧边栏展开收起动画
2014/12/22 HTML / CSS
Nip + Fab官网:英国美容品牌
2019/08/26 全球购物
销售副总经理岗位职责
2013/12/11 职场文书
自荐信写法介绍
2014/01/25 职场文书
《傅雷家书》教学反思
2014/04/20 职场文书
伊索寓言教学反思
2014/05/01 职场文书
校运会口号
2014/06/18 职场文书
2014年骨干教师工作总结
2014/12/19 职场文书
房地产销售主管岗位职责
2015/02/13 职场文书
安全知识竞赛主持词
2015/06/30 职场文书
left join、inner join、right join的区别
2021/04/05 MySQL
vue实现同时设置多个倒计时
2021/05/20 Vue.js
一篇文章带你学习Mybatis-Plus(新手入门)
2021/08/02 Java/Android
MySQL空间数据存储及函数
2021/09/25 MySQL