SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    May 2002
    Location
    San Diego, CA
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Is there a way to fix an Image in Foreground?

    I'm working on a new layout using CSS, trying different designs, but I want to have my banner across the top stay in an absolute position. For an example of the basic design, look here:
    http://www.exiesuniverse.com/newsCSS.html

    I know how to use the background fixed property (and I'm using it), and I know about layers. But is there any way to fix a property in the foreground? As you scroll down the page, I want the banner to stay on top ~ the text to scroll under it.

    I've found the javascript for the "geocities" floating logo, but that's not really what I want. Am I asking for too much?

  2. #2
    morphine for a wooden leg randem's Avatar
    Join Date
    Jun 2002
    Location
    .chicago.il.us
    Posts
    957
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure, so don't hold me to this...

    I believe that there is a property in CSS2+ that is meant to provide this, but current browsers do not support it.

    At present, I'm sure the best solution is to use the javascript method you mentioned.

  3. #3
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I personally hate the javascript method due to the buggy rendering that happens when scrolling which can result in fragments of the layer being scattered up and down the page. (ie. not being 'cleaned off')

    W3C have a simple CSS solution which you can view here.

    Also, rather than redrawing/replacing the 'locked' layer like the javascript method, the CSS method literally locks it in position. No redraw, no replacing.

    Regarding support... current browsers *do*. (Officially supported from NN4+ and IE 4+ according to W3Schools.

    I tested the W3C page with NN4.7 and it didn't seem to work, but it works perfectly on IE5.1 and Opera 5 (all Mac)
    Last edited by Bill Posters; Jun 22, 2002 at 23:41.
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  4. #4
    SitePoint Enthusiast
    Join Date
    May 2002
    Location
    San Diego, CA
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Bill,
    That W3C script is just what I'm talking about! But for me it doesn't work in IE 6 on windows (it did work in Netscape 6.2 & 7). I'll have to check a few friends computers and see if its just me or what.
    I really do want to find a way in CSS, I don't like the "jumpiness" of the javascript method either.

  5. #5
    SitePoint Wizard
    Join Date
    Apr 2002
    Posts
    2,307
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    there's also a problem with that fixed menu that i've found -

    it works fine for me (mac ie5.0) until i scroll the page. once i've scrolled, visually it's still fine, but the links cease to work.

    so the click sensitive areas scrolls with the page even though the visable menu stays where it is.
    no scrolling and it works fine - which obviously defeats the whole point of it.

    does this happen on other people's setups, or is it just mac ie5? anyone know of a way to fix this?

    also it definetly won't work at all in ie 5 or 6 on a pc because they don't support the 'fixed' css command
    Last edited by johnyboy; Jul 14, 2002 at 06:18.


Bookmarks

Posting Permissions

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