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 相关文章推荐
屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键 的javascript代码
Apr 01 Javascript
JavaScript高级程序设计(第3版)学习笔记13 ECMAScript5新特性
Oct 11 Javascript
js中单引号与双引号冲突问题解决方法
Oct 04 Javascript
node.js中的events.emitter.once方法使用说明
Dec 10 Javascript
JS判断form内所有表单是否为空的简单实例
Sep 09 Javascript
微信小程序 开发经验整理
Feb 15 Javascript
JS实现二叉查找树的建立以及一些遍历方法实现
Apr 17 Javascript
JavaScript 通过Ajax 动态加载CheckBox复选框
Aug 31 Javascript
vue.js中实现登录控制的方法示例
Apr 23 Javascript
JS构造一个html文本内容成文件流形式发送到后台
Jul 31 Javascript
微信小程序如何使用globalData的方法
Jun 06 Javascript
微信小程序实现日历小功能
Nov 18 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来实现网络服务
2009/09/15 PHP
PHP学习之输出字符串(echo,print,printf,print_r和var_dump)
2011/04/17 PHP
PHP开发实现微信退款功能示例
2017/11/25 PHP
滚动经典最新话题[prototype框架]下编写
2006/10/03 Javascript
javascript检查表单数据是否改变的方法
2013/07/30 Javascript
JavaScript异步加载浅析
2014/12/28 Javascript
JS获取图片高度宽度的方法分享
2015/04/17 Javascript
JavaScript生成二维码图片小结
2015/12/27 Javascript
浅谈JS中String()与 .toString()的区别
2016/10/20 Javascript
jQuery实现圣诞节礼物传送(花式轮播)
2016/12/25 Javascript
JS+canvas实现的五子棋游戏【人机大战版】
2017/07/19 Javascript
浅谈Vue父子组件和非父子组件传值问题
2017/08/22 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
vue分页插件的使用方法
2019/12/25 Javascript
JavaScript浅层克隆与深度克隆示例详解
2020/09/01 Javascript
详解python基础之while循环及if判断
2017/08/24 Python
全面了解Nginx, WSGI, Flask之间的关系
2018/01/09 Python
Python简单计算文件MD5值的方法示例
2018/04/11 Python
对python 生成拼接xml报文的示例详解
2018/12/28 Python
详解python之heapq模块及排序操作
2019/04/04 Python
对django views中 request, response的常用操作详解
2019/07/17 Python
美国NBA官方商店:NBA Store
2019/04/12 全球购物
Conforama瑞士:家具、厨房、电器、装饰
2020/09/06 全球购物
美国购买韩国护肤和美容产品网站:Althea Korea
2020/11/16 全球购物
Linux管理员面试经常问道的相关命令
2013/04/29 面试题
中医专业应届生求职信
2013/11/17 职场文书
研发工程师的岗位职责
2013/11/18 职场文书
大一军训感言
2014/01/09 职场文书
创业计划书——互联网商机
2014/01/12 职场文书
大专应届毕业生求职信
2014/07/15 职场文书
党的群众路线教育实践活动剖析材料
2014/09/30 职场文书
2014个人年度工作总结
2014/12/15 职场文书
2014年个人年终总结
2015/03/09 职场文书
防溺水主题班会教案
2015/08/12 职场文书
选择比努力更重要?这是长期以来对“努力”的最大误解
2019/07/12 职场文书
windows11选中自动复制怎么开启? Win11自动复制所选内容的方法
2022/07/23 数码科技