sticky menu w jQuery

Question

Właśnie jestem w 3 odc. w kursie CSS. Robię wszystko krok po kroku z tutoriala pana zelenta, aż napotkałem dosyć dziwny błąd. Mianowicie w odc. było, że trzeba podpiąć plik jQuery:

<script src = "jquery-3.1.1.min.js"></script>

*3.1.1 to najnowsza wersja*

Jako że jak próbowałem pobrać plik jQuery, to zamiast pobrania wyświetlił się plik na ekranie (po prostu, bez pobierania po prostu się wyświetlił). Więc kopiuję, i wklejam do nowego pliku tekstowego w index.html. Dalej według poradnika CSS:

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

I ostateczna próba. NIE DZIAŁA. Po długiej analizie, która nic nie dała, postanowiłem pobrać paczkę zip i zobaczyć skrypt obsługujący sticky menu:

<script>

			$(document).ready(function()
			{
				var NavY = $('.nav').offset().top; 
				var stickyNav = function()
				{
					var ScrollY = $(window).scrollTop();
				
					if (ScrollY > NavY) 
					{ 
						$('.nav').addClass('sticky');
					}
					
					else 
					{
						$('.nav').removeClass('sticky'); 
					}
				};
	 
				stickyNav();
	 
				$(window).scroll(function() 
				{
					stickyNav();
				});
			});
			
		</script>

I wklejam pod podpięciem jQuery. Włączam - działa. Tyle, że w momencie gdy menu powinno się płynnie przykleić i zostać na górze ekranu. Zamiast tego w chwili, gdy nasza nawigacja dotyka góry (i powinna się przykleić), przykleja się, ale cała strona przeskakuje w dół o ok. 100px. Czyli brakuje efektu płynności. Ale dalej. Gdy próbowałem usunąć podpięcie jQuery, a zostawić sam skrypt sticky; nie działało. Musiało być i to, i to. Jeśli ktoś chce, to mogę wkleić cały kod, ale chyba nie ma to sensu :/. A to jeszcze miejsce podpięcia:

<div class = "wrapper">

   (divy, divy i divy)

</div>
	
<script src = "jquery-3.1.1.min.js"></script>

</body>

</html>
		

Pozdrawiam i proszę o pomoc.

Answer 1

ogólnie jak jesteś na stronie jQuery, wybierasz sobie wersję i kiedy wyświetli Ci się na stronie to prawy przycisk myszy + zapisz stronę jako... i wtedy zapisuje Ci się tak, jak powinno być ;)
ja właśnie tak zrobiłam żeby sprawdzić o co chodzi i podmieniłam ten nowy plik jquery ze starym z odcinka i działa ;)

masz na pewno podpięte najpierw jquery a później kod JS?

Comments

 <script src = "jquery-3.1.1.min.js"></script>
         
        <script>
 
            $(document).ready(function()
            {
                var NavY = $('.nav').offset().top; 
                var stickyNav = function()
                {
                    var ScrollY = $(window).scrollTop();
                 
                    if (ScrollY > NavY) 
                    { 
                        $('.nav').addClass('sticky');
                    }
                     
                    else 
                    {
                        $('.nav').removeClass('sticky'); 
                    }
                };
      
                stickyNav();
      
                $(window).scroll(function() 
                {
                    stickyNav();
                });
            });
             
        </script>

o ten kod mi chodzi. Dzięki za pomoc :D

---

nie ma za co;)
a to jak to nie ma kodu w odcinku, jak jest?

---

No to chyba przegapiłem wklejenie tego kodu :}

---

aa no możliwe, że nie ma;) widziałam tylko, jak był gotowy napisany ten kod i opisywany, co, gdzie, jak :D

---

Dzięki za pomoc