Newbie need help on js

[alexhkleung]

i am trying to "rotate" 4 images at set time interval

here's my javascript

Code: Select all

window.onload = newpage;
var i=0;

function newpage() {
    var x = window.outerWidth - window.innerWidth + 905; 
    var y = window.outerHeight - window.innerHeight + 454;
    window.resizeTo(x, y);
    if (document.getElementById){;}
    else {alert ("Sorry, your browser doesn't support this script");}

    rotateImg;
}

function rotateImg(){
    switch (i){
    case 0: document.getElementById.("img1").src='../miniproject/images/icon_broadcaster.gif';
            document.getElementById.("img2").src='../miniproject/images/Devices_Icon.png';
            document.getElementById.("img3").src='../miniproject/images/burn_icon.png';
            document.getElementById.("img4").src='../miniproject/images/icon_streamingserver.gif'; break;
    case 1: document.getElementById.("img1").src='../miniproject/images/icon_streamingserver.gif';
            document.getElementById.("img2").src='../miniproject/images/icon_broadcaster.gif';
            document.getElementById.("img3").src='../miniproject/images/Devices_Icon.png';
            document.getElementById.("img4").src='../miniproject/images/burn_icon.png'; break;
    case 2: document.getElementById.("img1").src='../miniproject/images/burn_icon.png';
            document.getElementById.("img2").src='../miniproject/images/icon_streamingserver.gif';
            document.getElementById.("img3").src='../miniproject/images/icon_broadcaster.gif';
            document.getElementById.("img4").src='../miniproject/images/Devices_Icon.png'; break;
    case 3: document.getElementById.("img1").src='../miniproject/images/Devices_Icon.png';
            document.getElementById.("img2").src='../miniproject/images/icon_streamingserver.gif';
            document.getElementById.("img3").src='../miniproject/images/burn_icon.png';
            document.getElementById.("img4").src='../miniproject/images/icon_broadcaster.gif'; break;
    }
    i++;
    if (i==4){
    i=0;}
    setInterval("rotateImg()",3000);
}

And this is the section of html where i put my images

Code: Select all

<div id="rightcol">
    <a href="registration.htm" ><img id="img1" alt="User Registration" src="../miniproject/images/Devices_Icon.png"/></a>
    <a href="clipbrowser.htm" ><img id="img2" alt="Browse Audio Clip" src="../miniproject/images/Devices_Icon.png"/></a>
    <br />
    <img id="img3" src="../miniproject/images/Devices_Icon.png" alt="_" />
    <a href="audioplayer.htm" ><img id="img4" alt="Audio Player" src="../miniproject/images/Devices_Icon.png"/></a>
</div>

my script isn't working
can anyone tell me what's wrong?

thanks!!

[alexhkleung]

PS i have a question concerning DOM
whats the difference between window.document.getElementById.... and document.getElementById...?


thx

[Rakuli]

you have a random semi-colon in the first function of your script that may be cascading to errors further down, fix that first.

Code: Select all

   if (document.getElementById){;}

Can you explain if there is a specific error given by your browser as well?

Thanks.

[Rakuli]

In regards to your second question, there is now difference,

document.getElementById is the same as window.getElementById however, you may wish to refer to a specific window and sometimes you can get lost so if you opened a popup named "thisPopup" and want to reference it from the opening window use

thisPopup.document.getElementById.

Essentially, placing window. in front of the your document calls means that javascript cannot possibly falsely choose the scope as you you are telling it to explicity reference "THIS" window...

Hope that makes sense,

[alexhkleung]

Thanks for the quick reply!

i've deleted the lines of if and else in the newpage function
yet nothing happens... and no my browser did not give any error message
images simply did not change

[Rakuli]

rotateImg;

needs to have parenthesis you tell javascript it is a function call

Code: Select all

function newpage() {
    var x = window.outerWidth - window.innerWidth + 905; 
    var y = window.outerHeight - window.innerHeight + 454;
    window.resizeTo(x, y);
    if (document.getElementById){;}
    else {alert ("Sorry, your browser doesn't support this script");}

    rotateImg();
}

[alexhkleung]

hmmmm still it isn't working
anyway thx!