jQuery实现菜单式图片滑动切换
更新时间：2015年03月14日 11:11:51 投稿：hebedich
这篇文章主要介绍了jQuery实现菜单式图片滑动切换效果，主要是依托于jQuery Lightbox插件来实现，非常炫酷，这里推荐给小伙伴们
jQuery菜单式图片滑动切换是一款天猫官方网站的鼠标滑过图片切换导航菜单特效。
复制代码 代码如下:
$(function(){
// floorCon-slide
$(".floorCon-slide .floorConSlideImgNav li span").css({opacity:0.95})
$(".floorCon-slide .floorConSlideImgNav li.hover").find("span").css({left:0})//鍒濆
$(".floorCon-slide .floorConSlideImgNav li").mouseover(function(){
if($(this).hasClass("hover")){return}//涓嶅鐞嗘弧瓒崇姸鎬佺殑
var imgleft=$(this).index()*200*(-1)+"px";
$(this).addClass("hover").find("span").stop().animate({left:0},400)
$(this).siblings().removeClass("hover").find("span").stop().animate({left:"-20px"},600)
//鍥剧墖鏄剧ず
$(this).parent().prev(".floorConSlideImg").stop().animate({left:imgleft},400);
})
})
演示图：
以上就是本文的全部内容了，希望大家能够喜欢。
相关文章
queue是用来维护函数队列的。比较常用的是queue(queueName, callback);其中queueName缺省是fn，即标准函数队列。2011-06-06
这篇文章主要介绍了jQuery中通过ajax的get()函数读取页面的方法,需要的朋友可以参考下2016-02-02
如何实现input输入框实时输入触发事件，下面有个不不错的示例使用jquery实现的，感兴趣的朋友可以参考下2014-01-01![[jQuery] 事件和动画详解](//img.jbzj.com/images/xgimg/bcimg3.png)
这篇文章主要介绍了JQ事件和动画，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-03-03
这篇文章主要介绍了jquery检测上传文件大小,结合完整示例形式分析了jquery针对上传文件大小检测与计算相关操作技巧,需要的朋友可以参考下2020-04-04
本文主要介绍了jquery,js简单实现类似Angular.js双向绑定的方法。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
这篇文章主要介绍了jquery实现动态创建form并提交的方法,结合实例形式分析了jQuery form表单创建与提交相关操作技巧,需要的朋友可以参考下2019-05-05
下面小编就为大家带来一篇jquery操作ID带有变量的节点实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-12-12
这篇文章主要介绍了jQuery实现碰到边缘反弹的动画,非常不错，具有参考借鉴价值，需要的朋友可以参考下2018-02-02
最近在使用JQuery的ajax方法时，要求返回的数据为json数据，在处理的过程中遇到下面的几个问题，那就是采用不同的方式来生成json数据的时候，在$.ajax方法中应该是如何来处理的，下面依次来进行说明。2015-04-04
![[jQuery] 事件和动画详解](http://img.jbzj.com/images/xgimg/bcimg3.png)
最新评论