background image: how do you stretch to fit page?

Discussion in 'Photoshop' started by Davey Crocket, Dec 19, 2006.

0
  1. #1
    I have a small image and I was wondering if it is possible to make it fit a users window instead of multiplying itself and creating a dozen copies of itself. This is what I have for code right now for CSS style sheets:

    body {
    background-image: url(http://www.ehawaiiparadise.com/hawaiisunset.jpg);
    color: #000;
    font-family: sans-serif;
    font-size: 12px;
     
    Davey Crocket, Dec 19, 2006 IP
  2. JEET

    JEET Notable Member

    Messages:
    3,832
    Likes Received:
    502
    Best Answers:
    19
    Trophy Points:
    265
    #2
    At the best you can add:

    background-repeat: no-repeat;
    background-attachment: fixed;

    But stretching won't be the best idea, as some people have bigger screen size monitors and use larger resolution, while others use smaller ones(will see partial image).
    Plus a large image will take too long to download, which will create loading problems for you.

    You can use photoshop to stretch an image...
    Bye :)
     
    JEET, Dec 19, 2006 IP
  3. jayL

    jayL Peon

    Messages:
    525
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    0
    #3
    would be better to recreate the image. I can do that for you for a good price if you like. Although your link doesn't seem to be working.

    Let me know.
     
    jayL, Dec 19, 2006 IP
  4. RCO

    RCO Peon

    Messages:
    35
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I would suggest switching between a few different sized images, for graphic quality reasons
     
    RCO, Dec 20, 2006 IP
  5. hooperman

    hooperman Well-Known Member

    Messages:
    646
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    108
    #5
    This is my own personal opinion, and it might be completely wrong for what you want, but I would make a 1px wide but very long gradient that uses the colours in your image and have it repeat-x across the <body>. It will scale and be a miniscule size too meaning quicker download times.
     
    hooperman, Dec 20, 2006 IP