Put desktop wallpaper as site bg and keeping the image still

Discussion in 'HTML & Website Design' started by fuser00, Mar 9, 2010.

0
  1. #1
    Hi, im fuser and i want to know how to put a big image (actually i have it as wallpaper in my laptop) as background in a site but i dont want the image to move. I saw some sites where the images stays still although you scroll down the site.

    How can this be achieved?

    Thanks, fuser
     
    fuser00, Mar 9, 2010 IP
  2. CJ.Online

    CJ.Online Peon

    Messages:
    88
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    <body background="drkrainbow.gif" bgproperties="fixed"> should do the trick assuming that you understand how to use html
     
    CJ.Online, Mar 9, 2010 IP
  3. vs-fam

    vs-fam Peon

    Messages:
    15
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    The correct way to do this is through CSS.

    body { background: url(path/to/your/image.jpg) no-repeat fixed; }

    Just watch out for wide resolution screens.
     
    vs-fam, Mar 9, 2010 IP
  4. fuser00

    fuser00 Well-Known Member

    Messages:
    1,212
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    150
    #4
    I tried this and its not working...

    Thanks, fuser
     
    fuser00, Mar 9, 2010 IP
  5. vs-fam

    vs-fam Peon

    Messages:
    15
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Could you paste your code ?

    I want to see where you used the code (file or tag)
     
    vs-fam, Mar 9, 2010 IP
  6. fuser00

    fuser00 Well-Known Member

    Messages:
    1,212
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    150
    #6
    body{
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    color: #666666;
    background-color: #383838;
    background-image: url(/monumental.jpg);
    background-repeat: no-repeat fixed;
    }


    Thanks for the help!

    fuser
     
    fuser00, Mar 9, 2010 IP
  7. J32

    J32 Peon

    Messages:
    94
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #7
    make sure that the image path is correct. If the image is in the same folder as the html file you don't need the / there. And its background-repeat: no-repeat; background-attachement:fixed;


    
body{
font-family: Tahoma, Arial, Helvetica, sans-serif;
color: #666666;
background-color: #383838;
background-image: url(monumental.jpg);
background-repeat: no-repeat;
background-attachement:fixed;
}
    Code (markup):
     
    Last edited: Mar 10, 2010
    J32, Mar 9, 2010 IP
  8. fuser00

    fuser00 Well-Known Member

    Messages:
    1,212
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    150
    #8
    Hi, thanks for the help but its still not working.... :(

    Thanks again, fuser
     
    fuser00, Mar 11, 2010 IP
  9. vs-fam

    vs-fam Peon

    Messages:
    15
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #9
    You're definitely doing something wrong.

    Could you paste you URL site ?
     
    vs-fam, Mar 11, 2010 IP
  10. fuser00

    fuser00 Well-Known Member

    Messages:
    1,212
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    150
    #10
    Hi thanks for the help

    www . so lo ri ver . n et
     
    fuser00, Mar 11, 2010 IP
  11. vs-fam

    vs-fam Peon

    Messages:
    15
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #11
    I don't see the code you are supposed to use.
     
    vs-fam, Mar 11, 2010 IP
    fuser00 likes this.
  12. vs-fam

    vs-fam Peon

    Messages:
    15
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #12
    You need to modify the CSS file of your theme and use this:
    body{
    font-size: 12px;
    line-height: 18px;
    background-attachment: fixed;
    }

    I just did it in firebug and it works

    By the way, where do you host your site ? It is really slow
     
    vs-fam, Mar 11, 2010 IP
  13. fuser00

    fuser00 Well-Known Member

    Messages:
    1,212
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    150
    #13

    body{
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    color: #666666;
    background-color: #383838;
    background-image: url(/monumental.jpg);
    background-repeat: no-repeat;
    background-attachement:fixed;
    }

    This is my code.. do i have to remove the no-repeat??

    I gave you a green rep

    thanks again
     
    fuser00, Mar 11, 2010 IP
  14. vs-fam

    vs-fam Peon

    Messages:
    15
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #14
    It should be "attachment" you are mispelling it: attachement

    TIPS: Use the CSS and HTML validators from W3C and, if you use firefox, install firebug (addon) and "web developer". It will make your web designing life easier. "web developer" is available for IE as well.
     
    vs-fam, Mar 11, 2010 IP
  15. pjamesmg

    pjamesmg Member

    Messages:
    98
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    43
    #15
    I think you might be better off just making a "fluid" background, it would look a lot better.
     
    pjamesmg, Mar 12, 2010 IP
  16. fuser00

    fuser00 Well-Known Member

    Messages:
    1,212
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    150
    #16
    Hi, thanks for the suggestion.... why do you think that?

    Thanks, fuser
     
    fuser00, Mar 12, 2010 IP
  17. randywolf244

    randywolf244 Peon

    Messages:
    25
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #17
    ok y is there is a slash before the img url also try putting apostrophes around the url inside the ()

    try this


    font-family: Tahoma, Arial, Helvetica, sans-serif;
    color: #666666;
    background-color: #383838;
    background-image: url('monumental.jpg');
    background-repeat: no-repeat fixed;
    }

    tht should do the trick
     
    randywolf244, Mar 12, 2010 IP