CODEWITHSUNDEEP
jquery
saltcod
saltcod

Reputation: 2031

How can I fire a jQuery event when scrolling?

I'm so close to having my menu figured out. I've followed the instructions given by jQuery for Designers on Fixed Floating Elements. I want to extend this by putting the Site Title above the menu I've created when you scroll.

I've got it mostly working, but when I scroll, it continues to enter the Site Title text as I scroll. I just want it to enter the site title once—basically making it look like this screenshot. How can I run this .before() only one time?

Here's the fiddle I've got so far. http://jsfiddle.net/saltcod/NwFc9/

Upvotes: 0

Views: 112

Answers (2)

rkw
rkw

Reputation: 7297

You're using the scroll event correctly, but you need to add the Title only once, and then toggle it's visibility accordingly: http://jsfiddle.net/rkw79/NwFc9/1/

Your code is currently adding another instance of the 'Title' every time the scroll event triggers.

Main differences between the updates I made and your original:

  • instantiate the Title and add it only once
  • set the default display to invisible (display:none)
  • toggle the visibility
  • used .prepend() instead of .before() to add the title, this way it will live inside your 'fixed' menu

Upvotes: 1

Mike Thomsen
Mike Thomsen

Reputation: 37506

Use the scroll event.

Upvotes: 1

Related Questions