zoukankan      html  css  js  c++  java
  • jQuery hover 延时显示$.fn.hoverDelay (fnOver, fnOut,timeIn,timeOut) ;

    先看jQuery hover源代码:


    -----------------------------------------

    (function($) {

        $.fn.hoverDelay = function(fnOver, fnOut,timeIn,timeOut) {

                    var timeIn = timeIn || 200,

                        timeOut = timeOut || 200,

                        fnOut = fnOut || fnOver;

                    var inTimer = [],outTimer=[];

                    

                return this.each(function(i) {

                    $(this).mouseenter(function() {

                            var that = this;

                            clearTimeout(outTimer[i]);

                            inTimer[i] = setTimeout(function() {

                                fnOver.apply(that);

                            }, timeIn);

                      }).mouseleave( function() {

                            var that = this;

                            clearTimeout(inTimer[i]);

                            outTimer[i] = setTimeout(function() {

                                fnOut.apply(that)

                            }, timeOut);

                     });

            })

        }; 

    })(jQuery);

    --------------------------------------------------

    实例:

    --------默认值-------

    $("li").hoverDelay(

      function () {

        $(this).addClass('green');

      }, 

      function () {

        $(this).removeClass('green');

      }

    );

    -------------------------------

    $("li").hoverDelay(

      function () {

        $(this).addClass('green');

      }, 

      function () {

        $(this).removeClass('green');

      },1000,500

    );

    如有错误欢迎指出,共同学习。

    完整测试用例下载:http://115.com/file/c2aun17s#hoverdalay.html

  • 相关阅读:
    [CISCN2019 总决赛 Day2 Web1]Easyweb
    [极客大挑战 2019]Upload
    [SUCTF 2019]EasyWeb
    2020/2/1 PHP代码审计之任意文件读取及删除漏洞
    2020/1/31 PHP代码审计之文件包含漏洞
    [Luogu P1120]小木棍·加强版
    学习笔记·堆优化$mathscr{dijkstra}$
    [LuoguP1462]通往奥格瑞玛的道路($SPFA+$二分)
    [USACO08JAN]电话线$Telephone Lines$(图论$+SPFA+$ 二分答案)
    [USACO06NOV]玉米田$Corn Fields$ (状压$DP$)
  • 原文地址:https://www.cnblogs.com/piuba/p/2818336.html
Copyright © 2011-2022 走看看