deepa ashwi

deepa ashwi

  • NA
  • 109
  • 600.1k

Background image slideshow issue

Dec 14 2013 2:00 AM
Hi,
 
In the following source code,the content area is displayed below the background image but i want the content area to be displayed inside the background image .how to do it?
 
and i have attached the image which i got as output in which the content area is displayed below background image but i want content area inside the background image.how to do it?
 

Following is my source code:

<html> <head> <title>SlideShow</title> <style> #wrapper {width: 900px; margin:0 auto; background-color:#00FF00;             } #container {     height:auto;     margin:0 auto;     padding:0 0 20px;     width:751px;     background-color:#00FFFF;}
#slideshow img { -webkit-border-radius: 20px; -khtml-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; box-shadow: 2px 2px 5px #888888; } </style>   <script> var image1 = new Image(); image1.src ="Images/first.jpg"; var image2 = new Image(); image2.src = "Images/second.jpg";   </script> </head> <body>   <div id="wrapper"> <div id="slideshow"> <img src="Images/first.jpg" alt="" name="MySlide" width=900; height=200 /> <div id="container" style="height: 104px"> <h1>It is the Content Area</h1> </div> </div>   </div>   <script> var step=1 function SlideShow() { if(!document.images) return document.images.MySlide.src=eval("image"+step+".src") if(step<4) step++ else step=1 setTimeout("SlideShow()",3000) } SlideShow()   </script> </body> </html>

Attachment: img.rar

Answers (1)