Solved

Dynamically change image SRC

Posted on 2006-10-19
2
440 Views
Last Modified: 2012-05-05
Hello,

How does one dynamically alter the background image based upon the screen resolution? Basically, I have 2 images. If the user is a laptop user, they will always be 1024. If they are a desktop user, they will always be 800. I want to alter tbe <Body Background="somepath.gif"> entry to reflect that when they open the page.

<Script language="javascript">
            function loadBackground ()      {
            if (screen.width<=800) {
                  //alert('800');
                                                //Document.write(Body HTML for Image800.gif)
                  }
                  else  {
                  //alert('greater than');
                                                //Document.write(Body HTML for Image1024.gif)
                  }
            }
</Script>
0
Comment
Question by:SWRO
2 Comments
 
LVL 5

Accepted Solution

by:
aaronchan earned 125 total points
ID: 17771010
Remember to add onload event on your <body>.  Good luck!

<Script language="javascript">
      function loadBackground()     {
            if (screen.width <= 800) {
                  //alert('800');
                  //Document.write(Body HTML for Image800.gif)
                  document.body.background = 'http://i.i.com.com/cnwk.1d/i/hdft/redball.gif';
            }
            else  {
                  //alert('greater than');
                  //Document.write(Body HTML for Image1024.gif)
                  document.body.background = 'http://www.experts-exchange.com/images/10Years.gif';
            }
      }
</Script>
<body onload="loadBackground();">
</body>
0
 

Author Comment

by:SWRO
ID: 17771405
Thanks!
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Avoid defining the variables in the global scope; trying to define them in a local function scope. Because:   • Look-up is performed every time a variable is accessed.   • Variables are resolved backwards from most specific to least specific scope…
In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question