Member Offer
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

static navigation header......

Discussion in 'Website Coding & Programming Forum:' started by Baz_graffix, Mar 14, 2016.

  1. Baz_graffix

    Baz_graffix New Member

    I have been struggling to build a concept I had in my head..... Which is to have a static navigation bar or banner across the top of the webpage, I want it to look like the content is scrolling behind the banner, which may have opacity so cant just do that.
    Any ideas anybody? Would be much appreciated cos I am frying brain cells here
     
  2. Levi

    Levi Moderator Staff Member

    In css (this is for a css file) put something like the below, assuming the banner id is 'banner'.
    Code:
    #banner {width:100%; 
    background:rgba(255, 255, 255, 1);
    position: fixed;
    top:0;
    z-index:10000;}
    width is 100% of page width
    background is colour of banner, in this case rgb plus alpha channel for opacity
    position fixed sticks it in same place
    top: 0 - 0 pixels from top of page
    z-index 'raises' it above normal content that will be at 0 usually
     
    Paul Murray likes this.

Share This Page