源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jQuery实现菜单式图片滑动切换

  • 时间:2020-10-16 14:36 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery实现菜单式图片滑动切换
jQuery菜单式图片滑动切换是一款天猫官方网站的鼠标滑过图片切换导航菜单特效。
[u]复制代码[/u] 代码如下:
$(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);     }) })
演示图: [img]http://files.jb51.net/file_images/article/201503/201503141109583.png[/img] 以上就是本文的全部内容了,希望大家能够喜欢。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部