Hi,

I am trying to change background image of my div but its not picking up style of background image that I am setting from javascript. So can anyone help me out?

Thanks in advance.

Here is my code:

<HTML>

<script language="JavaScript">

NUMBER_OF_IMAGES = 3;

ImageNames = new Object();
ImageNames.length = NUMBER_OF_IMAGES - 1;

var myDiv = document.getElementById("myDiv");
count=1;
slideshowspeed=3000;

function slideit(){  

    newImage = "url(' " + ImageNames[count-1] + " ')";
    myDiv.style.backgroundImage = " ' " + newImage + " ' ";

    if(count==NUMBER_OF_IMAGES)
        count = 1;
    else
        count++;

    setTimeout("slideit()",slideshowspeed)  ;
}  
</script>

<BODY onload = "javascript:slideit()">
<div id='myDiv' style="background-image:url('images/images(1).jpg'); height: 190px; width:280px;" >
</div>
</BODY>

</HTML>

Recommended Answers

All 2 Replies

I got the solution actually myDiv variable is not intialized properly, so I changed the slideit() function as follows:

function slideit(){  
    newImage = "url(\"" + ImageNames[count-1] + "\")";
    document.getElementById("myDiv").style.backgroundImage = newImage;
    if(count==NUMBER_OF_IMAGES)
        count = 1;
    else
        count++;

    setTimeout("slideit()",slideshowspeed)  ;
} 

Thanks!

thanks for updating the thread. was about to start taking a look at this.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.