HEY all! new to the forum, i use to use JavaScript alot (YEARS ago) but switched to mostly flash dev. for just long enough to be COMPLETELY lost. haha. so any help is appreciated! sorry im sure its a nub problem..
so i am making a page that uses a random image fade in/out every 5 seconds BUT no image shows at all
... here's my javascript code:
Code:
var inum = 12;
imageHold = new Image();
desc = new Array
desc[0] = "Full Spread Magazine Layout. InDesign";
desc[1] = "Song Poster Project. Photoshop";
desc[2] = "Dan Pelonis Art Website 'paintings' Proof. HTML";
desc[3] = "Currents Art Competition Flyer. Photoshop";
desc[4] = "James River Architects Website Front Page. Flash";
desc[5] = "Krios Beach Camping Brochure Parokia Greece. InDesign";
desc[6] = "Mandala Lotus Logo Proof Sheet. Illustrator";
desc[7] = "Kialoa Cafe-Bar Website Concept Parokia Greece. Flash";
desc[8] = "Krios Beach Camping Poster Parokia Greece. Photoshop";
desc[9] = "Alphabet Book Project: Q. Illustrator";
desc[10] = "Alphabet Book Project: V. Illustrator";
desc[11] = "Alphabet Book Project: Y. Photoshop";
images = new Array
images[0] = "images2/1.jpg"
images[1] = "images2/2.jpg"
images[2] = "images2/3.jpg"
images[3] = "images2/4.jpg"
images[4] = "images2/5.jpg"
images[5] = "images2/6.gif"
images[6] = "images2/7.jpg"
images[7] = "images2/8.jpg"
images[8] = "images2/9.jpg"
images[9] = "images2/10.jpg"
images[10] = "images2/11.jpg"
images[11] = "images2/12.jpg"
var d=new Date();
var month=new Array(12);
month[0]="Jan";
month[1]="Feb";
month[2]="Mar";
month[3]="Apr";
month[4]="May";
month[5]="Jun";
month[6]="Jul";
month[7]="Aug";
month[8]="Sep";
month[9]="Oct";
month[10]="Nov";
month[11]="Dec";
function IMGpreload()
{
for(i=0; i<=12; i++)
{
imageHold.src=images[i];
}
}
var Alph = 0;
var speed = 10;
function fadeOut() {
var contI = doccument.images.main;
var contT = doccument.getElementById("desc");
if(Alph <= 0) {
Switch();
return;
}else{
contI.style.opacity = Alph/100;
contI.style.filter = 'alpha(opacity = ' + Alph + ')';
contT.style.opacity = Alph/100;
contT.style.filter = 'alpha(opacity = ' + Alph + ')';
Alph = Alph - speed;
setTimeOut("fadeOut()", 50);
}
}
function fadeIn() {
var contI = doccument.images.main;
var contT = doccument.getElementById("desc");
if (Alph >=100) {
setTimeOut("fadeOut()", 5000);
return;
}else{
contI.style.opacity = Alph/100;
contI.style.filter = 'alpha(opacity = ' + Alph + ')';
contT.style.opacity = Alph/100;
contT.style.filter = 'alpha(opacity = ' + Alph + ')';
Alph = Alph + speed;
setTimeOut("fadeIn()", 50);
}
}
function Switch() {
var randnum = Math.random();
var rando = Math.round(randnum * (inum-1)) + 1;
doccument.images.main.src = images[rando];
doccument.getElementById("desc").innerHTML = desc[rando];
fadeIn();
}
trying to populate
Code:
<body bgcolor="#000000" onload="IMGpreload(); Switch();">
<div id="center">
<div id="main">
<center> !!HERE!! --> <img src="images2/1.jpg" id="main" style="position:relative;"></center>
</DIV>
</div>
<div id="leftwelcome">
<div class="style1" id="main">
</div>
</div>
<div id="leftemail">
<div id="main">
<div id="desc">
!!HERE!!
</div>
</div>
</div>
the page is here
http://www.goldenepic.com/test/indexnew2.htmli'm sure its a silly problem, i just didn't want to keep looking at it and none of my friends are good with javaScript. thanks all!
