Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Senior Member
    Join Date
    Jun 2005
    Location
    Vestal-Binghamton Area, NY, USA
    Posts
    117
    Member #
    10325
    As in http://www.nasa.gov, the introductory page, as of June the 24th, has a blue layer, but the background is not totally covered...how do you do this without making everything an image or using totally flash?
    I have seen your future, and I have learned
    There will be no more Sadness. No more Anger. No more Envy.
    I HAVE WON!!!!

  2.  

  3. #2
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Hmm... I don't know that you could. At the simplest level, it looks like they used extra images here. They could have set a background on the body, but the problem is centering it might be a slight issue. Then, they could put a div with a background (the blue one this time) on top of that, to give the same effect. The div would be absolutely positioned.

    To make the fade-through effect you see there, you would use, as a background image for the div, a PNG with transparency. I can't remember for sure, but I think IE can handle PNG transparency if it's the background of a div, so even that shouldn't be an issue.

    Anyway, that's an idea for how to accomplish it with less than the fifteen images they have there.

  4. #3
    Senior Member justlivyalife's Avatar
    Join Date
    Jul 2003
    Location
    Birmingham, UK
    Posts
    2,871
    Member #
    2374
    The nasa page makes use of images to create the effect seen:

    http://www.nasa.gov/externalflash/de...nasa_title.jpg
    http://www.nasa.gov/externalflash/de...s/lt_panel.jpg
    http://www.nasa.gov/externalflash/de...s/rt_panel.jpg
    http://www.nasa.gov/externalflash/de...s/lower_lt.jpg
    http://www.nasa.gov/externalflash/de...t_panel-07.jpg

    As I can't insert images just have a look at those, you'll see how it is accomplished.

    Agrreing with Shadowfiend, you could do what was described, but I'm unsure about IE's handling of the PNG?
    justlivyalife - The future depends on what we do in the present. (Mahatma Gandhi)
    WDF Resources: WDF Rules
    Non-WDF: JavascriptSource | Dynamic Drive | phpBB | HTML-Kit | Winamp | Download Firefox | Morguefile

  5. #4
    Senior Member
    Join Date
    Jun 2005
    Location
    Vestal-Binghamton Area, NY, USA
    Posts
    117
    Member #
    10325
    So it's difficult, I guess I'll use Flash instead...

    Thanks for your help, guys (even though I didn't really understand most of the explanation Shadowfiend gave me, no offense, difficult vocabulary is all...)
    I have seen your future, and I have learned
    There will be no more Sadness. No more Anger. No more Envy.
    I HAVE WON!!!!

  6. #5
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Well, I couldn't really explain it too clearly as the idea wasn't even 100% fleshed out in my head. I can explain things much clearer when I've already written the code out, which I hadn't in this case... Sorry.

    If you'd like I can try and put some sort of example together in the next few days to show you.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:02 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com