jestem zielony w js a mam problem wymagający jego użycia.
Chciałbym, żeby po kliknięciu na dowolny link, strona przesuwała się po przejściu np o 500px w dół.
szukałem na forum, wiem że można to zrobić uzywając onclick, ale trudno mi to połączyć z jumpScroll do konkretnego miejsca.
Będę wdzięczny za pomoc.
Zaraz, zawartość strony ma się przesuwać, czy przewijać?
cała strona ma się przesunąć lub przwinąć, lub poprostu od razu wyświetlić na danej wysokości - powiedzmy 500px od szczytu, a dziać się ma to po kliknieciu na dowolny link i przejściu do jego celu. jest to sklep na joomla - virtuemart. U góry strony jest stały obszar którego nie chcę usuwać jest dosyc spory i żeby zobaczyc tresci po klinięciu na dowolny link czy to do produktu czy artykułu trzeba ręcznie przewijac stronę w dół żeby coś zobaczyć.
przy wejściu na stronę, strona ma się wyświetlać od góry (normalnie), natomiast po przejściu do dowolnej podstrony przewijac czy przesuwać do jej zawartości kóra znajduje się poniżej ok 500 px.
doszukałem się następujących informacji:
przeszukuje wszystkie linki i nadaje im funkcje:
oraz przeskok
Jeśli ktoś byłby w stanie to jakoś złożyć do kupy byłbym wdzięczny.
przypomne, że zalezy mi żeby po kliknięciu na dowlony link strona przesunela sie do miejsca wyswietlania jego zawartosci - powiedzmy 500 px w dół.
przy wejściu na stronę, strona ma się wyświetlać od góry (normalnie), natomiast po przejściu do dowolnej podstrony przewijac czy przesuwać do jej zawartości kóra znajduje się poniżej ok 500 px.
doszukałem się następujących informacji:
przeszukuje wszystkie linki i nadaje im funkcje:
CODE
var linki = document.getElementsByTagName('a');
for(i=0; i < linki.length; i++)
{
if (linki[i].className=='costam')
linki[i].onclick = costam; // nazwa funkcji bez ()!
/* można też użyć: linki[i].onclick = function() {return costam(para,metry);} */
}
for(i=0; i < linki.length; i++)
{
if (linki[i].className=='costam')
linki[i].onclick = costam; // nazwa funkcji bez ()!
/* można też użyć: linki[i].onclick = function() {return costam(para,metry);} */
}
oraz przeskok
CODE
function jumpScroll() {
window.scroll(0,150); // horizontal and vertical scroll targets
}
window.scroll(0,150); // horizontal and vertical scroll targets
}
Jeśli ktoś byłby w stanie to jakoś złożyć do kupy byłbym wdzięczny.
przypomne, że zalezy mi żeby po kliknięciu na dowlony link strona przesunela sie do miejsca wyswietlania jego zawartosci - powiedzmy 500 px w dół.
jest taki plugin do jQuery - scrollTo.
ma może ktoś jeszcze jakieś pomysły?
podejrzewam, że nawet jakbym chciał, to nie dał bym rady zakotwiczyć wszystkich linków. Sklep ma już 500 produktów a najprawdopodobniej bedzie wiecej.
Przejrzałem kilka forum i wywnioskowałem, że chyba najlepiej będzie to zrobić za pomocą javascript, tylko że niestety brakuje mi wiedzy, żeby to wykonać.
Pytanie czy istnieje możliwość połączenia funkcji scrolljump z onclick - dla wszystkich linków?
Przejrzałem kilka forum i wywnioskowałem, że chyba najlepiej będzie to zrobić za pomocą javascript, tylko że niestety brakuje mi wiedzy, żeby to wykonać.
Pytanie czy istnieje możliwość połączenia funkcji scrolljump z onclick - dla wszystkich linków?
Tak, kod z jQuery:
Z plain JavaScript'em nie chce mi się myśleć o tej godzinie
Kod
$('a', $('#id_kontenera_z_linkami')).click(function(){
// tutaj kod z jumpTo
return false; // zablokowanie przekierowania href
});
// tutaj kod z jumpTo
return false; // zablokowanie przekierowania href
});
Z plain JavaScript'em nie chce mi się myśleć o tej godzinie
no właśnie tylko jak to zastosować... żeby odnośniło się do wszystkich linków z automatu... kilka postów wyżej zamieściłem kod który znalazłem. "Wiem, że dzwoni, ale nie wiem w którym kościele" - w tym problem 
naprawdę zależałoby mi na rozwiązaniu tego problemu...
naprawdę zależałoby mi na rozwiązaniu tego problemu...
Napiszę coś w plain JS, ale to wieczorem.
dzieki!
naprawde bede wdzieczny za udzielenie wskazowek!
naprawde bede wdzieczny za udzielenie wskazowek!
Nie potrzebujesz kotwiczyć linków - link z haszem przeszukuje też atrybuty z id. Jeśli kontener ma nadane id to po prostu stwórz link w postaci
Automatycznie powinien przeskoczyć do produktu. Możesz też doklejać hasz w locie z pomocą JS przed przejściem.
Automatycznie powinien przeskoczyć do produktu. Możesz też doklejać hasz w locie z pomocą JS przed przejściem.
owszem wszystkie interesujace mnie tresci wyswietlaja sie w jednym kontenerze. Rozumiem, że podany przez Ciebie sposób ma na celu przejście do odpowiedniego kontenera na stronie. Ale jak w tym momencie spowodować , żeby dotyczyło to każdego linku na stronie?
z tym kodem co podałeś to teoretycznie wystarczy zrobić:
Kod
var linki = document.getElementsByTagName('a');
for(i=0; i < linki.length; i++)
{
if (linki[i].className=='costam') {
linki[i].onclick = function() { window.scroll(0,150); return false; };
}
}
for(i=0; i < linki.length; i++)
{
if (linki[i].className=='costam') {
linki[i].onclick = function() { window.scroll(0,150); return false; };
}
}
wklejam do sekcji head z <script type="text/javascript"> na początku i </script> na końcu i niestety n ie działa.
a wiecie może jak automatycznie do wszystkich istniejących linków zastosować rozwiązanie zaproponowane przez @evertha?
Tak żeby z automatu dopisać do nich #content?
To praktycznie rozwiązałoby mój problem, tylko trochę denerwujące jest to że widać ten przeskok do kontenera. szkoda, że strona od razu się nie wyświetla na odpowiednim poziomie po kliknięciu w link...
a wiecie może jak automatycznie do wszystkich istniejących linków zastosować rozwiązanie zaproponowane przez @evertha?
Tak żeby z automatu dopisać do nich #content?
To praktycznie rozwiązałoby mój problem, tylko trochę denerwujące jest to że widać ten przeskok do kontenera. szkoda, że strona od razu się nie wyświetla na odpowiednim poziomie po kliknięciu w link...
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.