http://dukov.pl/testphp/ < strona funkcja się wywołuje oczywiście window.onscroll czasami zmienia swoje opacity i się zwija / rozwija, czasem nie.
function scrollFunc(e) { var nav = document.getElementById('header'); var how = (function(){ var x = document.getElementById('header'); if (x.currentStyle) var y = x.currentStyle['height']; else if (window.getComputedStyle) var y = document.defaultView.getComputedStyle(x,null).getPropertyValue('height'); return y; }()); console.log(how); var hvalue = parseFloat(how); console.log('Noooo: '+hvalue); console.log('offset to: ' + window.pageYOffset); if (hvalue >100 && window.pageYOffset > 150) { $("nav").animate({ opacity: '0.5', height: '70px' }); } else if (hvalue < 100 && window.pageYOffset < 250) { $("nav").animate({ opacity: '1', height: '150px' }); } } window.onscroll = scrollFunc;
Tu jest kod odpowiadający za ten efekt. jak widzicie navbar powinien się zwijać gdy przesuwam stronę, offset jest w górnych okolicach, a element nav ma wysokość większą niż 100px, rozwijać się to odwrotnie. Zmienne z warunków są pokazywane w konsoli, więc wiem, że warunki są spełnione, a funkcja wywołana, szkoda, że raz działa, raz nie działa.
EDIT
Zauważyłem, że kod działa, tylko wykonuje się gdy warunek jest spełniony, po kolejnym przesunięcią rolką i po opóźnieniu ok 1 sekundy, a to jest niedopuszczalne.