Hej,
chciałbym osiągnąć taki efekt, że po wciśnięciu ikonki, która jest zwykłym img strona przewija się w dół od daną ilość pixeli bądź do wskazanego diva.
any idea?
Przewijanie strony po wciśnięciu ikonki
Posted 26 October 2013 - 12:05
Posted 26 October 2013 - 13:23
Żaden ze mnie spec od jQery, ale trochę pogooglałem i chyba mam skuteczne rozwiązanie. Sprawdź:
<script> $(function() { $("#id_linka").bind("click", function() { $(window).scrollTop($("#id_diva").offset().top); //Scrolluj do diva o podanym ID. return false; }); }); </script>
Myślę, że komentarze wystarczą pzdr.
Posted 26 October 2013 - 14:57
Będzie działać ale nie na wszystkich przeglądarkach
Rzuć okiem na to: http://flesler.com/jquery/scrollTo/ sprawdzone, polecam.
Edited by unbreak, 26 October 2013 - 15:05 .
webDeveloper
Posted 26 October 2013 - 15:16
Będzie działać ale nie na wszystkich przeglądarkach
Rzuć okiem na to: http://flesler.com/jquery/scrollTo/ sprawdzone, polecam.
Mógłbyś podać przykład użycia? Kawałek kodu HTML z dwoma divami i obrazkiem? Nie bardzo rozumiem jak to użyć.
Posted 26 October 2013 - 16:05
Ściągasz i podpinasz pliczek: http://flesler-plugi...-1.4.3.1-min.js zaraz po jquery.
Używasz np. tak:
$('#id-ikonki').click(function(){ var target = $('#id-elementu-do-ktorego-ma-scrollowac'); $.scrollTo( target, 800 ); });
webDeveloper
Posted 28 October 2013 - 22:01
Ściągasz i podpinasz pliczek: http://flesler-plugi...-1.4.3.1-min.js zaraz po jquery.
Używasz np. tak:
$('#id-ikonki').click(function(){ var target = $('#id-elementu-do-ktorego-ma-scrollowac'); $.scrollTo( target, 800 ); });
Próbowałem u siebie coś takiego na linku, ale konsola błąd wyrzuca. Znowu przez konflikt?
Uncaught TypeError: Cannot call method 'click' of null
Posted 29 October 2013 - 08:10
To:
$('#id-ikonki')
Musi mieć dokładny id tego co ma być klikalne Twój błąd oznacza to, że podałeś błędny id
<span id="click-it">Kliknij</span> <script> $('#click-it').click(function(){...}); </script>
Btw, jeżeli robisz na linku (a href) to nie zapomnij o blokadzie defaultowej akcji:
$('a').click(function(e){ if(e.preventDefault) e.preventDefault(); e.returnValue = false; //tutaj reszta return false; //a to w razie czego :) })
Przy konfliktach zazwyczaj wyrzuca że nie rozpoznaje $.
webDeveloper
Podone tematy
Topic | Forum | Started By | Stats | Last Post Info | |
---|---|---|---|---|---|
Sposoby reklamowania strony www |
Promocja i marketing | x_n |
|
||
-50% na szablony ze strony TemplateMonsterszablony, motywy, zniżka and 1 more... |
Ogólne | jkaminski |
|
||
Nowy wygląd i funkcjonalność strony idhosting.plidhosting, hosting, serwery www and 2 more... |
Oferty firm hostingowych | mkus |
|
||
[Wykonam] Strony WP, pisanie tekstów i inne |
Inne | kreujemywizerunek |
|
||
Nazwa podstrony taka sama jak nazwa kataloguhtaccess |
HTML i CSS | RadekKw |
|
Also tagged with one or more of these keywords: scroll to, przewijanie, jquery, js
Pozostałe →
Inne →
Skąd się uczyć Angular.js 2Started by zonic, 27 Jan 2016 angular, js, kurs, skąd się uczyć and 2 more... |
|
|||
Answered
Technologie webowe - tworzenie stron www →
Javascript →
Wysuwane menu - kwestia chowania.Started by Snake_, 30 Dec 2015 jquery |
|
|||
Technologie webowe - tworzenie stron www →
Javascript →
Problem z napisaniem stronyStarted by luke99, 19 Dec 2015 scroll, js |
|
|||
Technologie webowe - tworzenie stron www →
HTML i CSS →
Prosta animacja/odliczanieStarted by unbreak, 10 Dec 2015 js, css |
|
|||
Technologie webowe - tworzenie stron www →
Javascript →
Bower i GruntStarted by unbreak, 09 Nov 2015 bower, grunt, js, javascript |
|
0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users