Wsparcie » Używanie i konfiguracja WordPressa » Płynne menu "One Page"

Płynne menu "One Page"

  • Jon Doe

    (@kbdrwnk)


    8 years, 4 months temu

    Witam serdecznie. Od kilku próbuję wykonać menu typu „One Page” i przyznam się, że utknąłem w pewnym miejscu a wszelkie sposoby, które znalazłem – nie pomagają. Pewnie mój problem to błahostka i można załatwić to jednym skryptem JS.

    A więc wykonałem menu w których odnośnikach umieściłem kotwice ( np. #home ) a sektory odpowiadające do menu nazwałem w „row id” danej sekcji. Menu działa, wszystkie odnośniki przenoszą w prawidłowe miejsce lecz.. Brak im płynności. Zamiast płynnej animacji scrollowania w dół to po prostu przeskakują w dany obszar. Jak mogę to zaradzić?

    Próbowałem jakiś wtyczek i innych sposobów, lecz po prostu nic mi nie pomogło. Możliwe, że źle to robiłem.

Viewing 2 replies - 1 through 2 (of 2 total)
  • ziemekpr0

    (@ziemekpr0)

    8 years, 4 months temu

    Rozwiązanie:

    $('.index a').click(function(e){
	e.preventDefault();
	var go_to = $(this).attr('href');
	$('html, body').animate({scrollTop: $(go_to).offset().top}, 2000);
});

    Klasa .index to nazwa menu zawierającego linki do sekcji na stronie.
    Działa to mniej więcej tak: Przypisujemy event click do wszystkich linków w menu z klasą .index. Funkcja preventDefault() ma na celu zatrzymanie domyslnej akcji przeglądarki, czyli tego efektu skoku. Do zmiennej go_to pobieramy wartość atrybutu href z klikniętego linku (musi być z hashem w tym przypadku).
    Na koniec wykonujemy animację. 2000 to czas trwania animacji w [ms].

    Tutaj znajdziesz prosty przykład:
    http://wpadmin.pl/demos/2013-06-16/demo.html

    Thread Starter Jon Doe

    (@kbdrwnk)

    8 years, 4 months temu

    Dzięki za odpowiedź i chęć pomocy, ale poradziłem sobie z wykorzystaniem wtyczki „Smothscoller”. Tak czy siak, dziękuję serdecznie, może pomoże komuś innemu.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Temat ‘Płynne menu "One Page"’ jest zamknięty na nowe odpowiedzi.

Wyświetlenia