/    Sign up×
Community /Pin to ProfileBookmark

Hi working fine in IE But not in all the browsers

Hi,

I created html page in that javascript is not working, It’s workinf IE but in all other browsers is not working, in center of my html page it’s not rotating the images, please open this code in Dreamewever. cheek please give me sol’n…….

i attached images also please find and give me sol’n, It’s workinf fine in IE not other browsers…………..this website…..
[url]www.reefvilla.com/home.html[/url]

Thanks and regards,
Venu J

[code]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<TITLE>Reef- The Ultimate Tropical Beach Villa – Sri Lanka</TITLE>

<link rel=”shortcut icon” href=”favicon.ico”>
<link rel=”stylesheet” href=”css/lay.css” type=”text/css” />
<SCRIPT LANGUAGE=”JavaScript”>
<!–
var imgIndex = 0;
var imgArray = new Array(“images/Untitled-1_01.gif”,”images/Untitled-1_02.gif”,”images/Untitled-1_03.gif”,”images/Untitled-1_04.gif”,”images/Untitled-1_05.gif”);
var imgTextArray = new Array(“This is image1″,”This is image2″,”This is image3″,”This is image4″,”This is image5″,”This is image6”)

function RotateImage(i)
{ if(i==1)
{temp =parent.document.getElementById(“imgRotator2”).src;
document.getElementById(“imgRotator2”).src=document.getElementById(“imgRotator”).src;
document.getElementById(“imgRotator”).src = temp;
}
if(i==2)
{ temp =document.getElementById(“imgRotator3”).src;
document.getElementById(“imgRotator3”).src=document.getElementById(“imgRotator”).src;
document.getElementById(“imgRotator”).src = temp;
}
if(i==3)
{
temp =document.getElementById(“imgRotator4”).src;
document.getElementById(“imgRotator4”).src=document.getElementById(“imgRotator”).src;
document.getElementById(“imgRotator”).src = temp;
}
if(i==4)
{ temp =document.getElementById(“imgRotator5”).src;
document.getElementById(“imgRotator5”).src=document.getElementById(“imgRotator”).src;
document.getElementById(“imgRotator”).src = temp;
}
}

// My Code Here

/*
<style>
body{
background-repeat: no-repeat;
background-position: 600 300;
}
</style>
*/

var speed = 3000

// Specify the image files
var Pic = new Array()
Pic[0] = ‘images/center01.gif’
Pic[1] = ‘images/center02.gif’
Pic[2] = ‘images/center03.gif’
Pic[3] = ‘images/center04.gif’
Pic[4] = ‘images/center05.gif’
Pic[5] = ‘images/center06.gif’

// do not edit anything below this line

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.getElementById){
document.getElementById(“centerRotate”).background = Pic[j];
// document.getElementById(“center”).background = Pic[j];
j = j + 1
if (j > (p-1)) j=0
t = setTimeout(‘runBGSlideShow()’, speed)
}
}
// Codes end here

// My Code Here

/*
<style>
body{
background-repeat: no-repeat;
background-position: 600 300;
}
</style>
*/

var sp = 3000

// Specify the image files
var Pc = new Array()
Pc[0] = ‘images/right1.gif’
Pc[1] = ‘images/right2.gif’
Pc[2] = ‘images/right3.gif’
Pc[3] = ‘images/right4.gif’
Pc[4] = ‘images/right5.gif’
Pc[5] = ‘images/right6.gif’
Pc[6] = ‘images/right7.gif’
Pc[7] = ‘images/right8.gif’

// do not edit anything below this line

var a
var b = 0
var l = Pc.length

var preLoad = new Array()
for (i = 0; i < l; i++){
preLoad[i] = new Image()
preLoad[i].src = Pc[i]
}

function BGSlideShow(){
if (document.body){

document.getElementById(“center”).background = Pc[b];
b = b + 1
if (b > (l-1)) b=0
a = setTimeout(‘BGSlideShow()’, sp)
}
}
// Codes end here

//–>
</SCRIPT>
</head>

<body bgcolor=”#85BDD6″ style=”width:100%” onload=”runBGSlideShow();BGSlideShow()” >
<a id=”corner” href=”http://www.infosensetechnologies.com” style=”filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’images/infosense1.png’,sizingMethod=’scale’);”>Infosense Technologies</a>
<div align=”center” id=”Layer6″ style=”position:relative; width:938px; height:543px; z-index:4; margin-top:40px; width:100%” >

<table border=”0″ cellpadding=”0″ cellspacing=”0″ width=”938″ height=”543″>
<tr>
<td width=”200″>
<table border=0 cellpadding=”0″ cellspacing=”0″ width=”202px” height=”543″ background=”images/newside1.gif” class=”SmallText2″>

<tr><td valign=”top”>
<table style=”text-align:left;font-size:9pt; margin-top:130px; font-family:Verdana” cellpadding=”0″ cellspacing=”0″ >
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”home.html”>Villa Overview</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”suites.html”>Suites</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”resort.html”>Resort Facilities</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”dining.html”>Dining</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”spa&fiteness.html”>Spa and Fitness </A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”location.html”>Location</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”package.html”>Packages and Offers</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”excursions.html”>Excursions</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”contact.html”>Contact</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”rates.html”>Rates</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”map.html”>Map</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”terms&condtion.html”>Terms and Conditions</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”usefulinformation.html”>Useful Information</A></DIV></td></tr>
<tr><td width=”20%” height=”15″>&nbsp; </td><td><DIV ALIGN=”left”><A HREF=”weddings.html”>Weddings</A></DIV></td></tr>
</table>
</td></tr>
</table>
</td>
<td width=”378″ class=”SmallText”>
<table width=”378″ border=”0″ cellpadding=”0″ cellspacing=”0″ id=”centerRotate” >
<tr>
<td width=”378″ height=”543″ style=”vertical-align:top”> </td>
</tr>
<!–<tr><td height=”48″ class=”BigCCText”>
<div align=”center” style=”color:#ECC60B” ><font face=”OzHandicraft BT” size=”+3″>
the ultimate tropical beach villa</font>
</div>
</td>
</tr>–>

</table>

</td>
<td width=”360″>
<TABLE WIDTH=360 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=4>
<img style=”display: block” border=0 id=”imgRotator” name=”imgRotator” src=”images/image18.jpg” width=”360″ height=”340″ ></TD>
</TR>
<TR>
<TD>
<IMG style=”display: block” id=”imgRotator2″ name=”imgRotator2″ src=”images/image5.jpg” width=”90″ height=”60″
onclick=”javascript:RotateImage(1);”>
<TD>

<IMG style=”display: block” id=”imgRotator3″ name=”imgRotator3″ src=”images/image10.jpg” width=”90″ height=”60″
onclick=”javascript:RotateImage(2);”></TD>
<TD>

<IMG style=”display: block” id=”imgRotator4″ name=”imgRotator4″ src=”images/image19.jpg” width=”90″ height=”60″
onclick=”javascript:RotateImage(3);”></TD>
<TD>
<IMG style=”display: block” id=”imgRotator5″ name=”imgRotator5″ src=”images/image3.jpg” width=”90″ height=”60″
onclick=”javascript:RotateImage(4);”></TD>
</TR>
<TR>
<TD COLSPAN=4 id=”center” background=”images/right5.gif” width=”360″ height=”143″ style=”vertical-align:top”>
<div align=”left” style=”padding-top:10px; margin-left:10px; margin-right:10px;”>
<p> </p>
<p>&nbsp;</p>
</div>
</TD>
</TR>
</TABLE>

</td>
</tr>
</table>

</div>
<span align=”center” class=”SmallText1″ style=”padding-right:120px;”>Copyright&copy; Reef All Rights are Reserved.</span>

</div>
</body>
</html>
[/code]

[upl-file uuid=599c7cf4-ab38-4666-b585-1d2816b6dc6e size=10kB]center01.gif[/upl-file]

[upl-file uuid=e2982904-9fa9-4c15-a70e-6d0ed52e11fb size=9kB]center02.gif[/upl-file]

[upl-file uuid=6c817953-d519-4a41-9197-ef60f1565150 size=11kB]center03.gif[/upl-file]

[upl-file uuid=4fbca91a-0588-445c-9f1c-59637f465626 size=13kB]center04.gif[/upl-file]

[upl-file uuid=f0d48aad-2ea1-44c7-b948-f386a63c3f34 size=12kB]center05.gif[/upl-file]

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@KorSep 26.2008 — I see no rotation neither in IE7, nor in FF, Opera or Chrome

At a first glance:

1.
<i>
</i>document.getElementById("centerRotate").[COLOR="Red"]background = Pic[j];[/COLOR]

I would have used CSS on-the-fly as:
<i>
</i>document.getElementById("centerRotate")[COLOR="Blue"].[B]style[/B].background =[B]'url('+ Pic[j]+') no-repeat 0 0'[/B];[/COLOR]

and so on for the rest of.

  • 2. Under an XHTML Doctype, the embedded script code must be nested inside CDATA islands to prevent XML interpretation of some special characters (< > &). And use [B]type[/B], not the the deprecated [B]language[/B]
    <i>
    </i>&lt;script [COLOR="Blue"]type="text/javascript"[/COLOR]&gt;
    [COLOR="Blue"]/*&lt;![CDATA[*/[/COLOR]
    [COLOR="Teal"]... code here ...[/COLOR]
    [COLOR="Blue"]/*]]&gt;*/[/COLOR]
    &lt;/script&gt;
  • ×

    Success!

    Help @venu_1200 spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 5.18,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...