44 users online (0 members and 44 guests)  


  Results 1 to 13 of 13

Related

  1. Help with body width    Forum: HTML Forum
    Replies: 3
  2. Replies: 1
  3. page not adjusting to body    Forum: CSS Forum
    Replies: 0
  4. document.body.clientWidth ???    Forum: Website Scripts Forum
    Replies: 3
  5. Hi every body    Forum: General Discussion
    Replies: 1
  1. #1
    Glenvern's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Apr 2002
    Location
    Norfolk, UK.
    Posts
    112

    Background Imaging in the body tag

    How do I make a background image in the 'body tag' fit different size monitors without getting the tiling effect in the larger screen sizes..
    Glenvern

  2. #2
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hiya Glenvern. Welcome to the forums!

    There is, unfortunately, bo way to 'stretch' an image. Its tiling or nothing.

    However, you could build some JavaScript to detect the resolution, and load the perfectly sized image.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  3. #3
    Glenvern's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Apr 2002
    Location
    Norfolk, UK.
    Posts
    112
    Thanx QD need to find a script to accomplish what you suggest, any suggestions.?
    Glenvern

  4. #4
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Ah. PrivateMessage Derek, he is much better at JavaScript than me. Tho tell him to post the result here, I want to see what he comes up with
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  5. #5
    Derek's Avatar
    Be Yourself

    Status
    Offline
    Join Date
    Aug 2001
    Location
    St. George, Utah, USA
    Posts
    466
    Ok I EXPECT a thank you for this good hour of my time lol and the answer was staring me straight in the face the whole time I couldn't figure out a right way to reference the background etc, I even tried using CSS with it but it ends up it was this simple little code.

    <script language="JavaScript">
    <!--
    if (screen.width <= 640) {
    document.write('<body background="pic1.gif">')
    }
    else if (screen.width <= 800) {
    document.write('<body background="pic2.gif">')
    }
    else if (screen.width <= 1024) {
    document.write('<body background="pic3.gif">')
    } else {
    document.write('<body background="pic4.gif">')
    }
    -->
    </script>

    hope you enjoy it.

  6. #6
    Derek's Avatar
    Be Yourself

    Status
    Offline
    Join Date
    Aug 2001
    Location
    St. George, Utah, USA
    Posts
    466
    oh ya put it in the <head> section and... I got tired of waiting for the pm so I just posted it here

  7. #7
    Glenvern's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Apr 2002
    Location
    Norfolk, UK.
    Posts
    112
    Thanks for response Dereck, that really looks good, will now go away and give it a try.. (where's a good place to learn Java and do I need to know 'C')...
    Glenvern

  8. #8
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    hmm, I was in admin the other day and noticed that there are bunches of pms in peoples boxes, more than seemed normal. I have no problem with what people discuss in pms that is why it is called PRIVATE messaging,however I will ask that discussions related to websites be kept public whenever possible. I ask this for the same reason that I refuse email support to those that email me. Solving ones problems privately does just that, solves ones problems. Doing it publicly can potentially help of people who may stop by at another time with the same question, or may give others ideas as to something they may want to try on thier site.

    thanks

    D
    AHFBWEB Less customers per server, more power for you!

    Business Class Shared Hosting

  9. #9
    Derek's Avatar
    Be Yourself

    Status
    Offline
    Join Date
    Aug 2001
    Location
    St. George, Utah, USA
    Posts
    466
    hmm alright I guess I have had a few PHP questions/discussions in private I'll keep them more open...

    Do you mean JavaScript or Java programming? Java is a I think serverside language that is very complicated (go with PHP) if that's what you mean, and C is a programming language that creates programs, not web pages. If you wanna learn JavaScript(that is what I used up there), then I suggest getting "JavaScript Bible" by Danny Goodman because learning on the web is in no way compared (and not very effective) unless your a really fast learner and pick up on syntax easy.

  10. #10
    jocyyu's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2003
    Posts
    1

    Unhappy another question

    first of all, thx Derek for posting the script~ it is very useful~

    but because i also want to use a randomizing background java script (changing bg whenever it loads), i don't know how i can make the two work together...

    here's the script:

    ***in <head>:
    <script language="JavaScript"><!--
    rnd.today=new Date();
    rnd.seed=rnd.today.getTime();
    function rnd() {
    rnd.seed = (rnd.seed*9301+49297) % 233280;
    return rnd.seed/(233280.0);
    };
    function rand(number) {
    return Math.ceil(rnd()*number);
    };
    // end central randomizer. -->
    </script>

    ***before <body background="something">:
    <script language="JavaScript"><!--
    document.write('<body background="some url' + rand(5) + '.jpg" ');
    //--></script>


    i found this script in another website.... i don't understand javascript... T.T

  11. #11
    zipps's Avatar
    New User

    Status
    Offline
    Join Date
    Sep 2003
    Posts
    1

    Angry Background Image Tile help!!

    Hi I am having trouble with my site I am using dreamweaver and the background has a tiling effect. Is there any way to get rid of this? Or perhaps making the background after a certain paragraph all black? Im not much of a programmer. Any help would be great. I have found a way to make a fixed background image but it makes my text scroll over the image which im using for the background. Here is a link to my site http://q3clands.free-host.com/ The free host also decided to recently add banners grrrrr...Are there any alternatives besided designing in flash? Thanks
    Last edited by zipps; 09-24-2003 at 12:48 PM.

  12. #12
    Android's Avatar

    Status
    Offline
    Join Date
    Oct 2002
    Location
    I AM CANADIAN
    Posts
    440

    Talking

    Quote Originally Posted by zipps
    Hi I am having trouble with my site I am using dreamweaver and the background has a tiling effect. Is there any way to get rid of this? Or perhaps making the background after a certain paragraph all black?
    Which is it? You can have the background not tile with CSS:
    Code:
    <style>
    <!--
    
    body{ background:url("/images/smiley.gif") no-repeat; }
    -->
    </style>
    or if you want the background of the paragraph all black put this between the HEAD tags:
    Code:
    <style>
    <!--
    .black { background-color:#000000; }
    -->
    </style>
    and change the paragraph tag to:
    Code:
    <p class="black">
    Paragraph stuff here
    </p>
    Check out the CSS tutorials http://css.somepeople.net/]here

  13. #13
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    This is a very old thread, new folks with questions should open their own threads so that they do not get lost.



Tags for this Thread