KnowledgeHub
Questions
Tags
Users
Search
Alex Rivera
|
Logout
Edit Question
Title
Body
I want to change the visibility of an element after the user scrolls down 100px. I have some code already, var fixed = false; $(document).scroll(function() { if( $(this).scrollTop() >= 100 ) { if( !fixed ) { fixed = true; $('#logo-scroll').css({position:'fixed', display:'visible !important'}); } } else { if( fixed ) { fixed = false; $('#logo-scroll').css({display:'none'}); } } }); JSFiddle . The code has two problems. It doesn't default to be invisible, I want it so it starts invisible. It doesn't repeat, when the user scrolls back up, it doesn't go back being invisible. More details, I want to make something like this header, but, as you can see, there's a certain point where you see half of the small logo, and a PART of the bigger one. It doesn't affect techcrunch much as the header is small, but on my site, it does. I have made everything, I just need to start it in display:none , and become visible after 100px.
Tags (comma-separated)
Save Edits
Cancel