jquery scrollto mousewheel问题

时间:2013-05-23 08:57:54

标签: jquery scrollto mousewheel

我真的很烦恼ScrollTo插件的问题。

网页为:http://webdizajntest.com/amphiro

正如你所看到的,我用鼠标滚轮触发事件制作了某种垂直滚动主页,滚动到下一个和上一个div。

这一切都很完美,直到我改变了一些东西(我不知道是什么),现在只有当我用鼠标滚轮时才能正常工作!当我向上鼠标滚动时,它仍然向下滚动。

为了清楚起见,我需要这种滚动:http://www.beoplay.com/Products/BeoplayA8

我用来完成此任务的代码是:

jQuery(document).ready(function() {     

    var $current, flag = false; 

    jQuery(function() {          
        jQuery('body').mousewheel(function(event, delta) {
            if (flag) { return false; }
            $current = jQuery('div.current');

            console.log(delta);
            console.log($current);

            if (delta < 0) {
                $prev = $current.prev();

                if ($prev.length) {
                    flag = true;

                    /* Ako je prvi */
                    if($current.attr('id') == "home-first"){
                        $prev = jQuery("#top-home");
                    }

                    if($current.attr('id') == "top-home"){
                        $prev = $current;
                    }

                    if($current.attr('id') == "vision-technology"){
                        jQuery('body').scrollTo('#top-home', 1000, {
                            onAfter : function(){
                                flag = false;
                            }
                        });
                    }
                    else{
                        jQuery('body').scrollTo($prev, 1000, {
                            onAfter : function(){
                                flag = false;
                            }
                        });
                    }

                    $current.removeClass('current');
                    $prev.addClass('current');
                }

            } else {
                $next = $current.next();

                if ($next.length) {
                    flag = true;

                    /* Ako je poslednji */
                    if($current.attr('id') == "next3"){
                        $next = $current;
                    }

                    /* Ako je prvi */
                    if($current.attr('id') == "top-home"){
                        $next = jQuery("#vision-technology");
                    }


                    jQuery('body').scrollTo($next, 1000, {
                        onAfter : function(){
                            flag = false;
                        }
                    });
                    $current.removeClass('current');
                    $next.addClass('current');
                }
            }

            event.preventDefault();
        });
    });    

请帮助!!!!

1 个答案:

答案 0 :(得分:0)

看看这个插件http://nick-jonas.github.io/windows/ Windows(github)是一个插件,可以让你构建单页网站,其中包含占据整个屏幕的部分。该插件为您提供了在新部分进入可见性并处理捕捉时调用的回调,因此您可以使用自定义导航菜单或更多功能轻松扩展它。