sticky navbar

Discussion in 'CSS' started by lew1s666, May 2, 2014.

  1. #1
    how to make this sticky navbar


    using wordpress roots.io theme and boostrap.

    so it will start at bottom and when you scroll will be fixed at top
     
    lew1s666, May 2, 2014 IP
  2. xXxpert

    xXxpert Well-Known Member

    Messages:
    604
    Likes Received:
    34
    Best Answers:
    9
    Trophy Points:
    165
    Digital Goods:
    7
    #2
    Please can you show a demo of what you are looking for ??
     
    xXxpert, May 3, 2014 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    I'm assuming there must be a image blocked or something -- since I'm not seeing or understanding what you are even asking.

    NOT that wasting screen real estate better used on delivering content with making some idiotic "position:fixed' element is something that should be done on a website in the first place, no matter how many ignorant halfwit "gee ain't it neat" scripttards and PSD jockeys seem to think otherwise.
     
    deathshadow, May 4, 2014 IP
  4. lew1s666

    lew1s666 Member

    Messages:
    101
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    30
    #4
    i wan to make navbar like this. http://www.dittodc.com/
     
    lew1s666, May 6, 2014 IP
  5. lew1s666

    lew1s666 Member

    Messages:
    101
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    30
    #5
    Hi, so I added sticky navbar there. projects.qbf.ie/sticky-navbar , but when i go down the navbar just jumps on top. want it smooth moving from bottom to top. like here . www.dittodc.com/
     
    lew1s666, May 6, 2014 IP
  6. xXxpert

    xXxpert Well-Known Member

    Messages:
    604
    Likes Received:
    34
    Best Answers:
    9
    Trophy Points:
    165
    Digital Goods:
    7
    #6
    Than you should place it at bottom of slider as they did, all i can see your navbar is hidden by default and appearing only when you scroll down
     
    xXxpert, May 6, 2014 IP
  7. Matthew2D

    Matthew2D Well-Known Member

    Messages:
    30
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    193
    #7
    Add these to the navbar css.

    position: fixed;
    bottom: 0;
    Code (markup):
     
    Matthew2D, May 8, 2014 IP