scrollTo div悬停

Question

我asked this question，答案非常有效。

唯一的问题是，现在我需要一个版本直接滚动到相应的div而不是滚动所有这些（即如果你将鼠标悬停在最后一个链接上，它将不会滚动到6个前div来到达它）。

当你没有悬停在链接上时，它仍然需要返回第一个div。

此外，如果您将鼠标悬停在该div上以及其链接上，那么它仍然是一种保留该div的方法，这将是最理想的。到目前为止，div并不棘手，因为当你将鼠标悬停在它上面并离开它的链接时，它就会向外滚动。

感谢。

Answer 1

尝试这种方式：

DEMO fiddle

var flag = false,
    goto = 0,
    hre;

    $('#nav li a').bind('mouseenter mouseleave', function(e) {
        if (e.type === 'mouseenter') {
           flag = true;
           hre = $(this).attr('href');
           goto = $(hre).position().top;
           $('#sections').stop().animate({top : '-'+goto },800);  
        } else {
           flag = false;

            setTimeout(function() {
               if( flag != true ){
                  $('#sections').stop().animate({top : '0' },800);  
               }      
            }, 1000);  
        }
    });

$('#sections').mouseenter(function(){
   flag = true;
});

在您悬停锚点后，快速进入“包装器”，它将不会返回到第一张幻灯片。

<小时/> 顺便说一句......为什么你不创造更多东西...... practique ？ ：）

EXAMPLE fiddle

Answer 2

我非常肯定你提出的问题是不可能的：

首先，当用户没有悬停在链接上时，您希望动画返回顶部但是当用户离开链接并将鼠标悬停在滚动到的div上时，您还希望能够保持div。

这是一个jsfiddle，它可以解决你问题的第一部分。

http://jsfiddle.net/YWnzc/8/

我只是将动画时间设置为0

Answer 3

在制作动画之前，只需移动元素：http://jsfiddle.net/YWnzc/12/。

为方便起见，我使用了$.doTimeout和$.scrollTo。我还用正则表达式解析了数字。超时是允许移动到div而不向后滚动。

var current, prev;

jQuery( "#nav").delegate( "a", "mouseenter mouseleave", function(e){
    var i, self = this, pos;

    if( e.type == "mouseleave" ) {
        i = 1;   
    } else {
        i = $(this).attr("href").match(/(\d)$/)[1];
    }

    //stop the previous animation, otherwise it will be queued
    if(e.type === "mouseleave") {
        var elem = $("#section1").insertBefore(current);
        elem = $("#section1");
        $.doTimeout("test", 500, function() {
            current = $("#section1");
            jQuery("#wrapper").scrollTo(elem, 250);
        });
    } else {
        var elem = $("#section" + i);
        elem.insertAfter(current || "#section1");
        current = elem;
        $.doTimeout("test");
        jQuery("#wrapper").scrollTo(elem, 250);
    }
});

jQuery( "#wrapper").on("mouseover", function() {
    jQuery( "#wrapper").stop();
});

Answer 4

只需删除动画滚动并进行直接scrollTop()调用

小提琴演示：http://jsfiddle.net/YWnzc/9/