Search - Articles - Dev Forums - Favorites - Member Login
DevASP.NET for ASP.NET, VB.NET, XML and C# (C-Sharp) Developers Tuesday, March 03, 2009


Dev Articles
Search Directory
ESET
ASP.NET
VB.Net
C-Sharp
SQL Server
 

FREE 12 month online training for ASP.NET & MS Expression Studio and a Free copy of MS Expression Web with Windows Server Purchase
Change the Background Image of Your Web Form Programmatically

Author: DevASP
Download Source Code : 537_BackgroundImageChange.zip

This article is about how you can change the background image of your web page in a sequence, images will be change sequentially.

  • Steps you will do. 
  • Start visual studio and create a new web application.  
  • Open the HTML design of your web page and add the following JavaScript tag and function before closing the head tag. 

 

NOTE. You can also change the images and the speed by which the background images are changed. Here in the attached application there are four images in the root directory of the project with the name as specified in the array.

 

<SCRIPT LANGUAGE="JavaScript">

 

var speed = 10000

var Pic = new Array()

Pic[0] = '1.jpg'

Pic[1] = '2.jpg'

Pic[2] = '3.jpg'

Pic[3] = '4.jpg'

 

 

var t

var j = 0

var p = Pic.length

 

var preLoad = new Array()

for (i = 0; i < p; i++){

   preLoad[i] = new Image()

   preLoad[i].src = Pic[i]

}

 

function runBGSlideShow(){

   if (document.body){

   document.body.background = Pic[j];

   j = j + 1

   if (j > (p-1)) j=0

   t = setTimeout('runBGSlideShow()', speed)

   }

}

 

</SCRIPT>

 

Add the following HTML code to design you web page and call the above JavaScript functions.

 

<body onload="runBGSlideShow()">

      <cener>

      <H4>Dont forget to visit www.devasp.com</H4>

      <a href="http://www.devasp.com">Devasp Team</a>

      </cener>   

</body>

 

   
Add Article Comment:
Name :
Email Address :
   
Comments :
 
   
<< Creating Square Games Using JavaScript

Disclaimer - Privacy
© 2002-2010 DevASP.net