zoukankan      html  css  js  c++  java
  • hover事件出现闪烁

    要得到的效果:在jx项目中,ul里面有很多个li  li里面还包含一个图层(鼠标移上去图层显示出来 移出隐藏)

    问题:当鼠标移动上去的时候会出现闪烁。

    原因:用的hover 标签 鼠标移动上去li全部出现鼠标移动效果  所以才会出现闪烁。

    解决办法:换成mouseover和mouseleave  如:

    $(function(){

      $(".menu_1_1 li").mouseover(function(event) {

          var index=$(this).index();
          console.log(index);
          $(".menu_1_1 li:eq("+ index +")").mouseover(function(){

          $(".menu_1_1 li:eq("+ index +")> .i_dcod ").fadeIn();
          });
          $(".menu_1_1 li:eq("+ index +")").mouseleave(function(){

          $(".menu_1_1 li:eq("+ index +")> .i_dcod ").fadeOut();
          });

      });

    )}

    然后接下来得问题就是 点击招牌菜品 5元菜品(选项卡)。。。下面的li 鼠标移动上去就不会出现图层。原因是图层太多  上面的写法不能准确的定位到选项卡里面的li   可以写成这样:

    $('.i_ul li').click(function(){   
    var _pindex = $(this).index();
    $(".i_tabbox:eq("+_pindex+") > .menu_1_1 li").mouseover(function() {
    var index=$(this).index();
    $(".i_tabbox:eq("+ _pindex +") > .menu_1_1 li:eq("+ index +")").mouseover(function(){
    $(".i_tabbox:eq("+ _pindex +") > .menu_1_1 li:eq("+ index +")> .i_dcod ").fadeIn();
    });
    $(".i_tabbox:eq("+_pindex+") > .menu_1_1 li:eq("+ index +")").mouseleave(function(){
    $(".i_tabbox:eq("+_pindex+") > .menu_1_1 li:eq("+ index +")> .i_dcod ").fadeOut();
    });
    });
    })

  • 相关阅读:
    开源权限框架shiro 入门
    Struts1.2入门笔记
    memcache概述
    教你如何将中文转换成全拼
    WPF第一章(XAML前台标记语言(Chapter02代码讲解))
    WPF第一章(XAML前台标记语言)
    WPF简介
    Activity以singleTask模式启动,intent传值的解决办法
    linux下查看文件编码以及编码转换
    Fedora 17字体美化
  • 原文地址:https://www.cnblogs.com/camile/p/6093297.html
Copyright © 2011-2022 走看看