首頁>Program>source
更新:

這是一个jsbin示例證明了這个問题。

UPDATE 2:
這是固定版本,這要感谢預算


基本上,我有以下javascript,它將視窗滚動到頁面上的锚點:

// get anchors with href's that start with "#"
 $("a[href^=#]").live("click", function(){
     var target = $($(this).attr("href"));
     // if the target exists: scroll to it...
     if(target[0]){
         // If the page isn't long enough to scroll to the target's position
         // we want to scroll as much as we can. This part prevents a sudden 
         // stop when window.scrollTop reaches its maximum.
         var y = Math.min(target.offset().top, $(document).height() - $(window).height());
         // also, don't try to scroll to a negative value...
         y=Math.max(y,0);
         // OK, you can scroll now...
         $("html,body").stop().animate({ "scrollTop": y }, 1000);
     }
     return false;
 });

它工作正常……直到我手動尝試滚動視窗.滚動滚動條或滑鼠滚轮時,我需要停止当前的滚動動画...但是我不確定如何執行此操作。

這可能是我的出發點...

$(window).scroll(e){
    if(IsManuallyScrolled(e)){
        $("html,body").stop();
    }
}

...但是我不確定如何編碼 IsManuallyScrolled 功能.我已经檢查了 eevent 物件)在Google Chrome瀏覽器的控製台和AFAIK中無法區分手動滚動和jQuery的 animate() 滚動。

How can I differentiate between amanualscroll and one called via jQuery's $.fn.animate 功能?

最新回復
  • 5月前
    1 #

    尝試此功能:

    $('body,html').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup', function(e){
     if ( e.which > 0 || e.type == "mousedown" || e.type == "mousewheel"){
      $("html,body").stop();
     }
    })
    

    還看到了本教程吗?

    更新:現代瀏覽器現在使用" wheel"作為事件,因此我已將其包含在上面的代碼中。

  • 5月前
    2 #

    几天前我也遇到了同樣的問题.如果要使用jquery的動画功能,則必须使用輪詢功能来模擬動画。

    我做了這个類,應该在 ScrollDown.slow()時提供平滑的向下滚動 被稱為。

    ScrollDown.current=$(window).scrollTop();
    ScrollDown.lastValue;
    ScrollDown.lastType;
    ScrollDown.enabled=true;
    ScrollDown.custom=function(value,rate){  //let's say value==='bottom' and rate=10
        if(value==='bottom'){
            value=$(document).height()-$(window).height();
        }
        ScrollDown.current=$(window).scrollTop();
        ScrollDown.lastValue=value;
        (function poll(){
            setTimeout(function(){
                var prev=$(window).scrollTop();  //This is the critical part
                /*I'm saving again the scroll position of the window, remember
                10 ms have passed since the polling has started
                At this rate, if the user will scroll up for down pre!==ScrollDown.current
                And that means I have to stop scrolling.*/
                ScrollDown.current++; //increasing the scroll variable so that it keeps scrolling
                $(window).scrollTop(ScrollDown.current);
                if(ScrollDown.current<ScrollDown.lastValue && ScrollDown.enabled){  
                //ScrollDown.current<ScrollDown.lastValue basically checks if it's reached the bottom
                    if(prev!==ScrollDown.current-1){
                    /*I'm checking if the user 
                    scrolled up or down while the polling has been going on, 
                    if the user scrolls up then prev<ScrollDown.current-1, 
                    if the user scrolls down then prev>ScrollDown.current-1 
                    and at the next poll() the scrolling will stop 
                    because ScrollDown.enabled will bet set to false by ScrollDown.stop()*/
                        ScrollDown.stop();
                    }
                    poll();
                }
            },rate);
        })();
    };
    ScrollDown.stop=function(){
        ScrollDown.enabled=false;
    };
    ScrollDown.continue=function(){
        ScrollDown.enabled=true;
        switch (ScrollDown.lastType){
            case "fast":
                ScrollDown.fast(ScrollDown.lastValue);
                break;
            case "normal":
                ScrollDown.normal(ScrollDown.lastValue);
                break;
            case "slow":
                ScrollDown.slow(ScrollDown.lastValue);
                break;
        }
    };
    ScrollDown.fast=function(value){
        if(!ScrollDown.enabled){
            ScrollDown.continue();
        }else{
            ScrollDown.lastType='fast';
            ScrollDown.custom(value,1);
        }
    };
    ScrollDown.normal=function(value){
        if(!ScrollDown.enabled){
            ScrollDown.continue();
        }else{
            ScrollDown.lastType='normal';
            ScrollDown.custom(value,10);
        }
    };
    ScrollDown.slow=function(value){
        if(!ScrollDown.enabled){
            ScrollDown.continue();
        }else{
            ScrollDown.lastType='slow';
            ScrollDown.custom(value,50);
        }
    };
    function ScrollDown(){}
    

    因此,如果您要致電 ScrollDown.slow('bottom') 除非您手動向上或向下滚動,否則它將開始缓慢滚動直到到達頁面底部。

  • 5月前
    3 #

    您可以設置一个變數以指示您的動画呼叫處於活動狀態,然後檢查 滚動處理程式中的那个變數。

    window.IsAutoScrolling = true;
    $("html,body").stop().animate({ "scrollTop": y }, 1000);
    // Do something to set IsAutoScrolling = false, when the animation is done.
    $(window).scroll(e){  
    if(!window.IsAutoScrolling){  
        $("html,body").stop();  
    } 
    

  • qt:QCompleter自定義完成規則
  • php:如何對UTF-8字元串陣列进行排序?