Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Apr 2007
    Posts
    317
    Thanks
    24
    Thanked 3 Times in 3 Posts

    Need Guidance on how to do this

    Hi Guys,

    I noticed a feature on http://zendesk.com and other places around the net, where on zendesk the top horizontal nav bar kind of stays at the top of the screen once you have scrolled down the page a little bit. Please take a look at it. I really would like to learn how to do it, but I haven't got a clue what it would be called. I assume its done in javascript since its using DOM. Can anyone help me with either a name or a good tutorial on how to do it? That would be super! Thanks in advance.

  • #2
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    here is an example using the jQuery framework:

    http://return-true.com/2010/04/scrol...r-with-jquery/

  • Users who have thanked DanInMa for this post:

    macleodjb (03-22-2012)

  • #3
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    You mean like this?

    http://jsbin.com/umuwix

    I don't know what it's called ... but esentially it's changing an element's class when the scroll position has reached the offsetTop of the element. The element will go from position "absolute" or "relative" to "fixed" with top:0

    Once you scroll back above the original position, it will go from "fixed" to "absolute" or "relative" again.

  • #4
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Quote Originally Posted by macleodjb View Post
    Hi Guys,

    I noticed a feature on http://zendesk.com and other places around the net, where on zendesk the top horizontal nav bar kind of stays at the top of the screen once you have scrolled down the page a little bit. Please take a look at it. I really would like to learn how to do it, but I haven't got a clue what it would be called. I assume its done in javascript since its using DOM. Can anyone help me with either a name or a good tutorial on how to do it? That would be super! Thanks in advance.
    http://www.codingforums.com/archive/.../t-240254.html

    maybe this thread is reverent to your question

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,255
    Thanks
    203
    Thanked 2,557 Times in 2,535 Posts
    Quote Originally Posted by DaveyErwin View Post
    http://www.codingforums.com/archive/.../t-240254.html

    maybe this thread is reverent to your question
    It might even be relevant as well!

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #6
    Regular Coder
    Join Date
    Apr 2007
    Posts
    317
    Thanks
    24
    Thanked 3 Times in 3 Posts
    Thanks guys, that helped a lot. Its actually pretty easy in jQuery, i was expecting something a little more intricate. Appreciate it!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •