Problems with a slideshow script

[borbs]

Hello!

I'm trying to install a slideshow script on my site.
http://www.judao.com.br/bbb

When I test it off-line, works PERFECTLY.
Then, when I upload, the images just don't change...

What's the problem?
Thank you!

Here's the code:

var d=document;
$ = function(id) {
	if(!arguments[1]) return document.getElementById(id);
	else document.getElementById(id).style[arguments[1]]=arguments[2];
}


function delItem(arr,item){
for(;item<arr.length;item++) arr[item]=arr[item + 1];
arr.length=arr.length-1;
} function goURL(){
(Item[atual][3].indexOf('_blank')!=-1) ? window.open(Item[atual][3].substring(0,Item[atual][3].indexOf(' '))) : location.href=Item[atual][3];
} function startSlide(){ 
loadImages();
if(!paused) timeoutId=setTimeout('changeImg(1)',6000);
} function initialize(){
timeoutId=0;
textareaContent=d.form_cr.select_cr.value.split(/[\r\n]/i);
Item = new Array();
for(x=0,y=0;x<textareaContent.length;x++){ 
	if(textareaContent[x].length>30) Item[y++]=textareaContent[x].split('|');
	}
for(i=Item.length-1;i>=0;i--){
	Item[i][0]=Item[i][0].replace(/([ \n\t\r])+/, " ");
	Item[i][4]=(Item[i][4].length<3) ? '' : '<img src="'+Item[i][4]+'" border="0" style="margin-left:4px;" />';
	if(Item[i][1].length<3||Item[i][3].length<3||Item[i][2].length<3||Item[i][0].length<2) delItem(Item,i);
	}
if(Item.length==1) d.write('<style>#anterior,#proximo,#pause{visibility:hidden;}</style>');
atual = Math.random().toString().substring(2,6) % Item.length;
} function startPanel(){
usaCredito = '';
initialize();
if(arguments.length>0){
	if(!isNaN(arguments[0])) atual = arguments[0];
	}
if(paused) {imgpause='on'; altpause='alt="Ligar" title="Ligar"';}
else {imgpause='off'; altpause='alt="Parar" title="Parar"';}
d.write('<div id="to-blend">'+usaCredito+'<a href="javascript:goURL()"><img src="'+Item[atual][1]+'" id="imgslide" name="img1" border="0" title="'+Item[atual][0]+'" alt="'+Item[atual][0]+'"></a>');
d.write('<div id="escondido"><h2><a href="javascript:goURL()" id="p-link">'+Item[atual][2]+'<span id="txt1"></span><span id="icon-area">'+Item[atual][4]+'</span></a></h2></div></div>');
d.write('<div id="setinhas"><a href="javascript:void(0)" id="anterior" onclick="if(okToGo)changeImg(-1)"><img src="http:\/\/midia.judao.com.br/imagens/site/flash_volta.gif" border="0" /></a>&nbsp;');
d.write('<a href="javascript:void(0)" id="proximo" onclick="if(okToGo)changeImg(1)"><img src="http:\/\/midia.judao.com.br/imagens/site/flash_vai.gif" border="0" /></a></div>');
} 

function pauseSlide(){
if(paused){
	$('pause').title='Parar'; $('pause').alt = 'Parar';
	d.cookie="homeJUDAOpause=0;domain=.JUDAO.com.br;expires=Thu, 2 Aug 1970 20:47:11 UTC;"; 		
	paused=false;
	startSlide();
}else{
	clearTimeout(timeoutId);
	d.cookie="homeJUDAOpause=1;domain=.JUDAO.com.br;expires=Thu, 2 Aug 2222 20:47:11 UTC;"; 	
	$('pause').title='Ligar'; $('pause').alt = 'Ligar';
	paused = true;
} }

var okToGo=false;
var paused=(d.cookie.indexOf('homeJUDAOpause=1')!=-1) ? true : false;
onload=startSlide;








// painel rotativo //
function changeOpac(opacity){
var obj = $('to-blend').style;
obj.opacity=(opacity/101);
obj.MozOpacity=(opacity/101);
obj.KhtmlOpacity=(opacity/101);
} function blend(imagefile){
var speed=7;
var timer=0;
for(i=100;i>0;i-=2) setTimeout('changeOpac('+i+')', timer++ * speed);
setTimeout('changeContent()', timer * speed);
for(i=0;i<=100;i+=2) setTimeout('changeOpac('+i+')', timer++ * speed);
} function changeImg(id){
clearTimeout(timeoutId);
atual+=parseInt(id);
if(atual>Item.length-1) atual=0;
if(atual<0) atual=Item.length-1;
if(imgDsp[atual].complete==false){
	atual--;
	timeoutId = setTimeout('changeImg('+id+')',500);
	return;
	} 
if(d.all && navigator.userAgent.indexOf('Opera')==-1){
	try {
	oDiv = $('to-blend');
	oDiv.style.filter="blendTrans(duration=0.7)";
   	oDiv.filters.blendTrans.apply();
    oDiv.filters.blendTrans.play();
	changeContent();
	} catch(e) { changeContent(); }
} else { blend(); }
if(!paused) timeoutId=setTimeout('changeImg(1)',6000);
} function loadImages(){
imgDsp = new Array();
for(n=0;n<Item.length;n++){
	imgDsp[n]=new Image();
	imgDsp[n].src=Item[n][1];
	}
okToGo = true;
} function changeContent(){
d.img1.src=imgDsp[atual].src;
d.img1.alt=d.img1.title=Item[atual][0];
$('txt1').innerHTML=Item[atual][2];
if(usaCredito!='') $('credito').innerHTML=Item[atual][0];
$('icon-area').innerHTML=Item[atual][4];
}

[jscheuer1]

From your source:

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-594348-1";
urchinTracker();
</script>

<script src="http://www.hotwords.com.br/show.jsp?id=3315"></script>

</BODY>
</HTML>
<!-- Dynamic Page Served (once) in 0.539 seconds -->
<!-- Cached page served by WP-Cache -->

I'm not sure how it got there but it does this:

var d = document;try{d.write('');}catch(e){} d = null;

which interferes with the use of d in the slide show script. Just ditch d in the script and replace it with document:

$ = function(id) {
	if(!arguments[1]) return document.getElementById(id);
	else document.getElementById(id).style[arguments[1]]=arguments[2];
}


function delItem(arr,item){
for(;item<arr.length;item++) arr[item]=arr[item + 1];
arr.length=arr.length-1;
} function goURL(){
(Item[atual][3].indexOf('_blank')!=-1) ? window.open(Item[atual][3].substring(0,Item[atual][3].indexOf(' '))) : location.href=Item[atual][3];
} function startSlide(){ 
loadImages();
if(!paused) timeoutId=setTimeout('changeImg(1)',4444);
} function initialize(){
timeoutId=0;
textareaContent=document.form_cr.select_cr.value.split(/[\r\n]/i);
Item = new Array();
for(x=0,y=0;x<textareaContent.length;x++){ 
	if(textareaContent[x].length>30) Item[y++]=textareaContent[x].split('|');
	}
for(i=Item.length-1;i>=0;i--){
	Item[i][0]=Item[i][0].replace(/([ \n\t\r])+/, " ");
	Item[i][4]=(Item[i][4].length<3) ? '' : '<img src="'+Item[i][4]+'" border="0" style="margin-left:4px;" />';
	if(Item[i][1].length<3||Item[i][3].length<3||Item[i][2].length<3||Item[i][0].length<2) delItem(Item,i);
	}
if(Item.length==1) document.write('<style>#anterior,#proximo,#pause{visibility:hidden;}</style>');
atual = Math.random().toString().substring(2,6) % Item.length;
} function startPanel(){
usaCredito = '';
initialize();
if(arguments.length>0){
	if(!isNaN(arguments[0])) atual = arguments[0];
	}
if(paused) {imgpause='on'; altpause='alt="Ligar" title="Ligar"';}
else {imgpause='off'; altpause='alt="Parar" title="Parar"';}
document.write('<div id="to-blend">'+usaCredito+'<a href="javascript:goURL()"><img src="'+Item[atual][1]+'" id="imgslide" name="img1" border="0" title="'+Item[atual][0]+'" alt="'+Item[atual][0]+'"></a>');
document.write('<div id="escondido"><h2><a href="javascript:goURL()" id="p-link">'+Item[atual][2]+'<span id="txt1"></span><span id="icon-area">'+Item[atual][4]+'</span></a></h2></div></div>');
document.write('<div id="setinhas"><a href="javascript:void(0)" id="anterior" onclick="if(okToGo)changeImg(-1)"><img src="http:\/\/midia.judao.com.br/imagens/site/flash_volta.gif" border="0" /></a>&nbsp;');
document.write('<a href="javascript:void(0)" id="proximo" onclick="if(okToGo)changeImg(1)"><img src="http:\/\/midia.judao.com.br/imagens/site/flash_vai.gif" border="0" /></a></div>');
} 

function pauseSlide(){
if(paused){
	$('pause').title='Parar'; $('pause').alt = 'Parar';
	document.cookie="homeJUDAOpause=0;domain=.JUDAO.com.br;expires=Thu, 2 Aug 1970 20:47:11 UTC;"; 		
	paused=false;
	startSlide();
}else{
	clearTimeout(timeoutId);
	document.cookie="homeJUDAOpause=1;domain=.JUDAO.com.br;expires=Thu, 2 Aug 2222 20:47:11 UTC;"; 	
	$('pause').title='Ligar'; $('pause').alt = 'Ligar';
	paused = true;
} }

var okToGo=false;
var paused=(document.cookie.indexOf('homeJUDAOpause=1')!=-1) ? true : false;
onload=startSlide;






// painel rotativo //
function changeOpac(opacity){
var obj = $('to-blend').style;
obj.opacity=(opacity/101);
obj.MozOpacity=(opacity/101);
obj.KhtmlOpacity=(opacity/101);
} function blend(imagefile){
var speed=7;
var timer=0;
for(i=100;i>0;i-=2) setTimeout('changeOpac('+i+')', timer++ * speed);
setTimeout('changeContent()', timer * speed);
for(i=0;i<=100;i+=2) setTimeout('changeOpac('+i+')', timer++ * speed);
} function changeImg(id){
clearTimeout(timeoutId);
atual+=parseInt(id);
if(atual>Item.length-1) atual=0;
if(atual<0) atual=Item.length-1;
if(imgDsp[atual].complete==false){
	atual--;
	timeoutId = setTimeout('changeImg('+id+')',500);
	return;
	} 
if(document.all && navigator.userAgent.indexOf('Opera')==-1){
	try {
	oDiv = $('to-blend');
	oDiv.style.filter="blendTrans(duration=0.7)";
   	oDiv.filters.blendTrans.apply();
    oDiv.filters.blendTrans.play();
	changeContent();
	} catch(e) { changeContent(); }
} else { blend(); }
if(!paused) timeoutId=setTimeout('changeImg(1)',4444);
} function loadImages(){
imgDsp = new Array();
for(n=0;n<Item.length;n++){
	imgDsp[n]=new Image();
	imgDsp[n].src=Item[n][1];
	}
okToGo = true;
} function changeContent(){
document.img1.src=imgDsp[atual].src;
document.img1.alt=document.img1.title=Item[atual][0];
$('txt1').innerHTML=Item[atual][2];
if(usaCredito!='') $('credito').innerHTML=Item[atual][0];
$('icon-area').innerHTML=Item[atual][4];
}

[borbs]

Hey, man! =D
Thanx a lot! =D

REEEEEALLY THANX! =DDDDD

[borbs]

Oh wait, just a little problem:
on IE, when I press forward or back, it does not go forward or back.
It seems it jumps de "next" image...

Do you know what this could be?
Thanx again!

[jscheuer1]

I'm not seeing this in either IE 7 or IE 6 for the PC. Are you using a Mac? If not, are you still having the problem?

[borbs]

No, I'm using Windows!
On IE, when I click "next", for example, the slideshow turns black for a while (probably the time of a pictures) and thaaaaan shows the image.

But, if you say that this is not happening with you, might be with me.... =]

Thanx!

[jscheuer1]

I double checked as your description of the problem seemed different to me here:

when I click "next", for example, the slideshow turns black for a while

than here:

when I press forward or back, it does not go forward or back.
It seems it jumps de "next" image...

But, nothing like either of those things is happening for me in IE 7 or 6. In fact, what you describe here:

when I click "next", for example, the slideshow turns black for a while

Happens for me in other browsers - Opera and FF. I'm not sure why(*) this is but, it could be changed (I don't say fixed because, I am sure that the script was written that way). There are other scripts around that don't have that problem but none of them (that I know of) work quite like the one you have without modification. I did modify one here:

http://www.dynamicdrive.com/forums/s...ad.php?t=16919

Such that it functions pretty much like the script you are using, the look of the custom controls I created in that thread could be changed to match what your script's controls look like.



(*) I had a quick look at the script and it is because a shortcut is taken in IE using the blend filter while all other browsers use opacity levels. For opacity levels to work the same way in other browsers that the blend filter works in IE, another layer of code that creates a second display area that is rotated with the existing one as the images change is required. This is already used by the script I refer to in the linked thread above.

If you are still having trouble in IE, perhaps your settings are not allowing the blend filter to work as intended. What version of IE do you have?