zoukankan      html  css  js  c++  java
  • 案例3:事件切换及动画队列停止排队效果

        //鼠标移入事件

        $(".nav > li").mouseover(function(){

            $(this).children("ul").slideUp(200);

        })

        //鼠标离开事件

        $(".nav > li").mouseout(function(){

            $(this).children("ul").slideUp(200);

        })

        1.事件切换 hover 就是鼠标经过和离开的复合写法

        $(".nav>li").hover(function(){

          $(this).children("ul").slideDown(200);

        },function(){

          $(this).children("ul").slideUp(200);

        });

        2.事件切换hover 如果只写一个函数,那么鼠标经过和鼠标离开都会触发这个函数

        $(".nav>li").hover(function(){

          $(this).children("ul"),slideToggle();  //  li 下面的子元素 ul 移入显示出来,移出隐藏

        })

        注意:动画或者效果一旦触发就会执行,如果多次触发,就会造成多个动画或者效果排队的执行

        停止排队stop()方法

        stop( ) 写到动画或者效果的前面,相当于停止结束上一次动画

        $(".nav>li").hover(function(){

          $(this).children("ul"),stop().slideToggle();  // 停止上一次的动画

        })

  • 相关阅读:
    SSL 1579——泽泽在巴西
    SSL 1644——取数字问题
    SSL 1589——火车票
    SSL 1506——打鼹鼠
    SSL 1212——大厅安排
    洛谷 1064——金明的预算方案(动态规划的背包问题)
    SSL 1463——公共子串
    SSL 1461——最大连续数列的和
    SSL 1643——最小乘车费用
    SSL 1460——最小代价问题
  • 原文地址:https://www.cnblogs.com/qtbb/p/11333456.html
Copyright © 2011-2022 走看看