3 {{ upvoteCount | shortNum }}
3 {{ upvoteCount | shortNum }}

Scroll/follow in header - How to?

by zeke
2 replies
  • WEB DESIGN
    • |
I'm not really sure what this is called but I'm wondering how hard it would be to implement in my blog.

If you go to the following site:
Internet Techies - A Technology Guide on Software Tips, Tutorials, How to related to Windows, Linux

you'll see that the yellow bar across the top follows you as you scroll down the page.

Anyone have any ideas on how to do set that up?
#header #scroll or follow
  • Profile picture of the author Niche Kid
    Take a look at the page source and you will see a div called "tpromo"

    Its all done with CSS, see here:

    Code:
    .tpromo {
clear: both;
position: fixed;
background: lightYellow;
border: 1px solid #E6DB55;
margin: 0;
padding: 4px;
font-size: 13px;
top: 0px;
left: 0px;
height: 22px;
width: 100%;
text-align: center;
z-index: 9999;
}
    The important stuff in there is "position: fixed;", "clear: both", "width 100%", top & left:0

    Hopefully that sets you on the right track.

    cheers,
    Simon
    Signature
    {{ DiscussionBoard.errors[3386092].message }}
    • Profile picture of the author zeke
      Thank you Simon

      I've been out of town without computer access so sorry I missed this.



      Originally Posted by sbachell View Post

      Take a look at the page source and you will see a div called "tpromo"

      Its all done with CSS, see here:

      Code:
      .tpromo {
clear: both;
position: fixed;
background: lightYellow;
border: 1px solid #E6DB55;
margin: 0;
padding: 4px;
font-size: 13px;
top: 0px;
left: 0px;
height: 22px;
width: 100%;
text-align: center;
z-index: 9999;
}
      The important stuff in there is "position: fixed;", "clear: both", "width 100%", top & left:0

      Hopefully that sets you on the right track.

      cheers,
      Simon
      {{ DiscussionBoard.errors[3399569].message }}

Trending Topics