I Zapytanie tego pytania i Odpowiedź działa naprawdę dobrze.

Jedyną rzeczą jest to, że teraz potrzebuję wersji, która przewija się bezpośrednio do odpowiedniego DIV zamiast przewijać wszystkie z nich (tj. Jeśli najedziesz na ostatnie link, nie przewija 6 dawnych Divs, aby dotrzeć do niego).

Nadal musi wrócić do pierwszego div, gdy nie unosisz się nad linkiem.

Również byłoby to najbardziej idealne, gdyby był też sposób na pozostanie na tym div, jeśli najechałeś nad nim, jak również jego link. Na razie Div nie jest trudny, ponieważ kiedy się nad nim unosiłeś i zostawiasz jego link, to przewija.

Dzięki.

4
scferg5 22 listopad 2011, 22:59

3 odpowiedzi

Jestem prawie pewien, że pytasz, jest niemożliwe z tego powodu:

Najpierw chcesz, aby animacja zwrócił górę, gdy użytkownik nie unosi się nad linkiem, ale chcesz również być w stanie pozostać na div, gdy użytkownik opuszcza link i unosi się nad Div, który przewidział.

Oto jsfiddle, co jednak wykonuje pierwszą część twojego pytania.

http://jsfiddle.net/ywnzc/8/

Właśnie ustawię czas animacji na 0

1
Keith.Abramo 22 listopad 2011, 19:05

Wystarczy przesunąć elementy przed animowaniem: http://jsfiddle.net/ywnzc/12/.

Wykorzystałem z {x0}} i {x1}} dla wygody. Również analizowałem liczbę z regexp. Limit czasu jest pozwolenie na ruch do div bez przewijania z powrotem.

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();
});
1
pimvdb 22 listopad 2011, 19:27

Wystarczy usunąć przewiń animacja i wykonaj bezpośredni scrollTop()

Fiddle Demo: http://jsfiddle.net/ywnzc/9/

0
Jeff Wilbert 22 listopad 2011, 19:05