Ustawienie przyklejenia menu

pytanie zadane 27 czerwca 2018 w HTML i CSS przez SajK Początkujący (390 p.)

Witam

Mam problem z ustawieniem przyklejonego menu. Chciałbym, aby skrypt działał dopiero po skończeniu się zdjęcia, tj. aby przezroczystość paska menu ustawiła się na 1 dopiero, gdy skończy się zdjęcie. 123

Sticky mam ustawione tylko dla paska menu.

komentarz 27 czerwca 2018 przez Tomek Sochacki Ekspert (227,510 p.)

a gdzie kod? Najlepiej na codepen.

komentarz 27 czerwca 2018 przez SajK Początkujący (390 p.)

Nie wiem czego, ale nie działa mi skrypt sticky w codepen, być może coś pomieszałem ale jako tako kod jest. https://codepen.io/SajK/pen/BVqOow
Chodzi mi o to, aby ten górny pasek zmieniał opacity dopiero po tym niebieskim tle.

1 odpowiedź

odpowiedź 27 czerwca 2018 przez cz3ran Stary wyjadacz (13,380 p.)

Generalnie musisz zrobić to tak:

1. W JS pobierasz wysokość IMG (clientHeight)

2. Jeżeli window.scrollTop > wysokość IMG, ustawiasz mu opacity na 1 (100%)

3. W przeciwnym razie ustaw opacity na 0.2 (20%)

Bez kodu tyle Ci mogę podpowiedzieć xD Oczywiście sposób zadziała jeżeli IMG jest na samej górze (a pewnie tak jest, bo domyślam się co chcesz zrobić).

komentarz 27 czerwca 2018 przez SajK Początkujący (390 p.)

Nie ogarnę tego xd pod pasek menu jest podpięty zwykły skrypt StickyNav

Wiem, że wiecie o co mi chodzi ale już tak pomieszałem że nic nie działa xd

<script>

			$(document).ready(function() {
			var NavY = $('.TOP').offset().top;
			var HeightIMG = document.getElementById("IMG11");
			var txt = "682.31" + HeightIMG.clientHeight + "682.31<br>";
			txt += "1213" + HeightIMG.clientWidth + "1213";
			 
			var stickyNav = function(){
			var ScrollY = $(window).scrollTop();
				  
			if (ScrollY > HeightIMG) { 
				$('.TOP').addClass('sticky');
			
			} else {
				$('.TOP').removeClass('sticky'); 
			
			}
			};
			 
			stickyNav();
			 
			$(window).scroll(function() {
				stickyNav();
			});
			});
			
		</script>

Dodam, że ".TOP" - to menu, a "#IMG11" to zdjęcie po którym ma działać StickyNav, tzn. tylko przezroczystość, bo przyklejenie chcę, aby było od początku XD