plznty Posted October 12, 2009 Share Posted October 12, 2009 I have been using <html> <head> </head> <title>IP in networking</title> <body bgcolor="#000000" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF"> <div id="bg"><img src="/site/background.png" width="100%" height="100%" alt=""></div> <div id="content"><p></p></div> <style type="text/css"> /* pushes the page to the full capacity of the viewing area */ html {height:100%;} body {height:100%; margin:0; padding:0;} /* prepares the background image to full capacity of the viewing area */ #bg {position:fixed; top:0; left:0; width:100%; height:100%;} /* places the content ontop of the background image */ #content {position:relative; z-index:1;} </style> <!--[if IE 6]> <style type="text/css"> /* some css fixes for IE browsers */ html {overflow-y:hidden;} body {overflow-y:auto;} #bg {position:absolute; z-index:-1;} #content {position:static;} </style> <center> <a href="site/index.htm" target="main">home</a> <p><iframe frameborder="no" name="main" src="/site/index.htm" width="600" height="300" allowtransparency="yes"></iframe></p> </center> </body> </html> it stretches it but it shows me the image properties when i hover over any part of the image. How do I stretch the non selectable background image of the page. Quote Link to comment Share on other sites More sharing options...
xsist10 Posted October 12, 2009 Share Posted October 12, 2009 You can layer another transparent div over your entire background which will prevent people getting image properties when hovering over the background. That or move to browsers that support CSS 3 exclusively.... (i.e.: burn IE and be done with it). <div id="bg"><img src="/site/background.png" width="100%" height="100%" alt=""></div> <div id="bg-layer"></div> <div id="content"><p></p></div> ... <style type="text/css"> /* pushes the page to the full capacity of the viewing area */ html {height:100%;} body {height:100%; margin:0; padding:0;} /* prepares the background image to full capacity of the viewing area */ #bg, #bg-layer {position:fixed; top:0; left:0; width:100%; height:100%;} #bg-layer {z-index: 1;} /* places the content ontop of the background image */ #content {position:relative; z-index:2;} </style> Quote Link to comment Share on other sites More sharing options...
plznty Posted October 12, 2009 Author Share Posted October 12, 2009 You can layer another transparent div over your entire background which will prevent people getting image properties when hovering over the background. That or move to browsers that support CSS 3 exclusively.... (i.e.: burn IE and be done with it). <div id="bg"><img src="/site/background.png" width="100%" height="100%" alt=""></div> <div id="bg-layer"></div> <div id="content"><p></p></div> ... <style type="text/css"> /* pushes the page to the full capacity of the viewing area */ html {height:100%;} body {height:100%; margin:0; padding:0;} /* prepares the background image to full capacity of the viewing area */ #bg, #bg-layer {position:fixed; top:0; left:0; width:100%; height:100%;} #bg-layer {z-index: 1;} /* places the content ontop of the background image */ #content {position:relative; z-index:2;} </style> It still shows image properties sign at top left when i hover over. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.