how do I fix this code to randomly show a background image and scale it to the page size (css, html, java)?

here my code so far: <SCRIPT LANGUAGE="Javascript"> var samback1="graphics/one.jpg" var samback2="graphics/two.jpg" var samback3="graphics/three.jpg" var samback4="graphics/four.jpg" var samback5="graphics/five.jpg" var samback6="graphics/six.jpg" var samback=Math.round(6*Math.random()) if (samback<=1) samback=samback1 else if (samback<=2) samback=samback2 else if (samback<=3) samback=samback3 else if (samback<=4) samback=samback4 else if (samback<=5) samback=samback5 else samback=samback6 document.write('<body background="'+samback+'" bgcolor="#000000">') and in body: <img src="samback" var='samback' alt="background" width="1300" height="1000" id="samback" /> and in the css: #samback { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; z-index: 1; }

Public Comments

  1. Eventhough this is not the best way to do a background. I think this is what you want: <html> <head> <style> #samback { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; z-index: -1; } #content{ position: absolute; top: 0px; left: 0px; z-index: 10; } </style> <SCRIPT LANGUAGE="Javascript"> function imageFunc(){ var samback1="graphics/one.jpg" var samback2="graphics/two.jpg" var samback3="graphics/three.jpg" var samback4="graphics/four.jpg" var samback5="graphics/five.jpg" var samback6="graphics/six.jpg" var samback=Math.round(6*Math.random()); if (samback<=1){ samback=samback1; } else if (samback<=2){ samback=samback2; } else if (samback<=3){ samback=samback3; } else if (samback<=4){ samback=samback4; } else if (samback<=5){ samback=samback5; } else{ samback=samback6; } document.write('<img id="bodyBG" src="'+samback+'" width="100%" height="100%">'); } </script> <body> <script language="javascript"> imageFunc(); </script> <table id="content"> <tr> <td> I think is this what you want. </td> </tr> </table> </body> </html> Background objects or backgrounds themselves can't get scaled. They can be repeated. If you create a serious of patterns like scanlines, or different gradient colors that you want to randomly set, it would be much easier and perhaps look sharper. When you scale images, you're bound to end up with pixelation.
Powered by Yahoo! Answers