• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Przyklejone menu nie działa(sticky)

VPS Starter Arubacloud
0 głosów
681 wizyt
pytanie zadane 19 lutego 2017 w JavaScript przez Allen Obywatel (1,010 p.)

<script src="jquery-3.1.1.min (1)"></script>
		<script>

	$(document).ready(function() {
   var stickyNavTop = $('.nav').offset().top;

   var stickyNav = function(){
   var scrollTop = $(window).scrollTop();

   if (scrollTop > stickyNavTop) { 
      $('.nav').addClass('sticky');
   } else {
      $('.nav').removeClass('sticky');
    }
   };

   stickyNav();

   $(window).scroll(function() {
      stickyNav();
   });
   });

</script>
.sticky
{
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 100;
}

Moim celem jest stworzenie menu, które "przykleja się do górnej części ekranu"(sticky). Niestety coś nie działa i nie wiem co dalej zrobić. Dodam, że pobrałem plik z jquery.com i wkleiłem do folder z wszystkimi plikami, z których korzystam przy tworzeniu strony.

komentarz 19 lutego 2017 przez hoktaur Pasjonat (22,250 p.)

Czy z tą ścieżką jest tu na pewno wsio ok?

<script src="jquery-3.1.1.min (1)"></script>

może coś takiego:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

 

komentarz 19 lutego 2017 przez Allen Obywatel (1,010 p.)
Dziękuję za pomoc, teraz menu działa. Chciałbym jeszcze zrozumieć co robiłem żle w poprzedniej wersji (wszystko wykonywałem wg tego poradnika:https: https://www.youtube.com/watch?v=vd_GnTBzJ4U&index=3&list=PLOYHgt8dIdow6b2Qm3aTJbKT2BPo5iybv )

(Nauczyciel w poradniku w 36 min 17 sek pokazuje jak podpiąć js do html. Wydaje mi się, że zrobiłem wszystko tak samo). Proszę o wyjaśnienie mojego błędu.

1 odpowiedź

0 głosów
odpowiedź 19 lutego 2017 przez hoktaur Pasjonat (22,250 p.)

Widzisz błąd polega na podpięciu JQ ja podałem ci ścieżkę do zewnętrznego źródła:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

a w kursie biblioteka jest najpierw ściągnięta a następnie skopiowana w miejsce docelowe. Ty najprawdopodobniej pobrałeś ją dwa razy stąd pewnie ta 1 w nawiasie a pomiędzy nią a nazwą spacja:

jquery-3.1.1.min (1)

więc problem jest albo w tym że nie skopiowałeś odpowiedniego pliku, a może nie w to miejsce albo po prostu ta spacja wspomniana wyżej ...

komentarz 20 lutego 2017 przez Allen Obywatel (1,010 p.)
Pobrałem i skopiowałem plik ponownie (w odpowiednie miejsce). Nie ma spacji w html ani w nazwie jq. Jeżeli ktoś wie co robie żle, prosze o pomoc.

Podobne pytania

0 głosów
2 odpowiedzi 407 wizyt
pytanie zadane 14 marca 2018 w HTML i CSS przez Bembnias Początkujący (450 p.)
0 głosów
5 odpowiedzi 909 wizyt
pytanie zadane 8 lipca 2015 w JavaScript przez krecik1334 Maniak (58,390 p.)
0 głosów
0 odpowiedzi 258 wizyt
pytanie zadane 9 kwietnia 2020 w JavaScript przez Whynotslave Początkujący (250 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...