javascript - Jquery .animate() method doesnt seem to work with css top property -
O people, I'm trying to create a menu that slides from the top of the page after scrolling to a certain point And for some reason the jquery
animation function is not working perfectly, but if I decide to justify a alert ("hello") of animate function, )
, then it works fine. Here is my function code:
function header () {var main = document.getElementById ("main"); Var rect = main.getBoundingClientRect (); Var menu = document.getElementById ("menu unavailable"); Var y = rect.top; If (y & lt; = 5) {$ ("# menuappear") Animate ({top: "0px"}, 500); } And {$ ("# menu unavailable"). Animate ({Head: "- 93px"}, 500); }}
My HRM is:
& lt; Body onscroll = "header ()" & gt; ... & lt; Div id = "menuappear" & gt; & Lt; A href = "index.html" & gt; & Lt; Img class = "logo" src = "picture / logo .png" /> & Lt; / A & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; One onclick = "scrolltop ()" & gt; Home & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "index.html" & gt; What we do & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Our work & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; About us & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Join our team & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "contact.html" & gt; Contact & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt;
And here is my css
:
#menuappear {z-index: 1000000; Status: fixed; Top: -93px; Width: 100%; Height: 90px; Background color: # 242424; Margin: 0; Padding: 0; Border bottom: 3px solid # 49 CBCD; }
If someone can tell me what I am doing, then it would be great. Edit: This sometimes works but is actually unresponsive
"If more than one animation method Have been placed in the effect line for the same element, the subsequent animation element. These animations will not start until the first is complete. When. () Is called, then the next animation in the queue
The way you get the episode to & lt; body onscroll = "header ()" & gt;
A () Sometimes the creation of the queue leads to a delayed effect or does not work at all Optionally, stop () Instead of using
you can set the queue param wrong on animate ()
. (
Comments
Post a Comment