Hi there,
this may not be an advanced problem but to me it is
i got a great looking slide show script from this site (http://www.dhteumeuleu.com) but am having a lot of trouble adapting it to my needs. the problem is that when i add a rollover hyperlink to/in the page the slide show ceases to work. i hope somebody can help me with this. i have included the code with the rollover so you can see where i'm going wrong, to see the slideshow as it should look go to the website above
_______________ _______________ _______________ _____
_____[code=html]
<html>
<head>
<title>imgPre ss - Interactive DHTML art-demos</title>
<meta name="author" content="Gerard Ferrandez at http://www.dhteumeuleu .com">
<meta http-equiv="imagetoo lbar" content="no">
<style type="text/css">
body {margin:0; padding:0; position:absolu te; overflow:hidden ; background:#e8e 8e8; left:0; top:0; width:1000%; height:100%;}
img {position:absol ute; border:gray solid 1px; cursorointer; width:257px; }
span {position:absol ute; color:#ccc; font-family:verdana; font-size: 12px; width:200px;}
</style>
<script type="text/javascript">[/code][code=javascript]
<!--
// =============== =============== =============== =====
==
// script: Gerard Ferrandez - Ge-1-doot - JANUARY 2005
// news://news.leibowitz.org/nzn.fr.html
// http://www.dhteumeuleu.com/
// crossbrowser DOM
// =============== =============== =============== =====
==
window.onerror = new Function("retur n true");
document.onsele ctstart = new Function("retur n false");
screen.bufferDe pth = 16;
O = new Array();
box = 0;
img = 0;
txt = 0;
tit = 0;
W = 0;
H = 0;
nI = 0;
sel = 0;
si = 0;
//////////////////
ZOOM = 4;
rImg = 1.33;
speed = .1;
//////////////////
function dText(){
txt.style.textA lign = tit.style.textA lign = (sel<nI/2)?"left":"righ t";
txt.innerHTML = O[sel].tx;
tit.innerHTML = O[sel].ti;
}
function CObj(n, s, x, tx, ti){
this.n = n;
this.dim = s;
this.tx = tx;
this.ti = ti;
this.is = img[n];
this.vz = 0;
this.sx = 0;
this.x0 = x;
this.x1 = 0;
this.zo = 0;
this.clic = function(hlink) {
with(this){
if(n!=sel){
O[sel].is.style.curso r = "pointer";
if(!hlink)O[n].is.style.curso r = "default";
O[sel].dim = 100;
O[n].dim = ZOOM * 100;
sel = n;
l = 0;
for(k=0; k<nI; k++){
O[k].x0 = l;
l += O[k].dim;
}
txt.innerHTML = tit.innerHTML = "";
setTimeout("dTe xt()", 32);
} else {
// ==== open hyperlink window
if(hlink)window .open(hlink,"_b lank");
}
}
}[/code][code=javascript]
this.anim = function () {
with(this){
vz = speed*(vz+(x1-sx)*.5);
x1 -= vz;
sx = (n==0)?0:O[n-1].x0+O[n-1].dim;
zo -= (zo-dim)*speed;
l = Math.round((x1* si)+6*(n+1));
w = Math.round(zo*s i);
is.style.left = l;
is.style.top = (H-w*rImg)*.5;
is.style.width = w;
is.style.height = w*rImg;
if(sel == n){
if(sel<nI*.5)ti t.style.left = txt.style.left = l+w+6;
else tit.style.left = txt.style.left = l-(nx*.25)-6;
txt.style.top = -(w*rImg)*.25;
tit.style.top = (w*rImg)*.33;
}
}
}
}
function run(){
for(j in O)O[j].anim();
setTimeout("run ()", 16);
}
function doResize(){
tit.style.width = nx*.25;
txt.style.width = nx*.25;
tit.style.fontS ize = (nx / 30) + "px";
txt.style.fontS ize = (nx / 70) + "px";
with(box.style) {
width = W;
height = H;
left = nx / 2 - W / 2;
top = ny / 2 - H / 2;
}
}[/code][code=javascript]
function resize(){
nx = document.body.o ffsetWidth;
ny = document.body.o ffsetHeight;
W = nx * 90 / 100;
si = (W-((nI+1)*6))/((ZOOM*100)+((n I-1)*100));
H = (100 * si * rImg) + 14;
setTimeout("doR esize()", 16);
}
onresize = resize;
onload = function(){
box = document.getEle mentById("box") ;
tit = document.getEle mentById("tit") ;
txt = document.getEle mentById("txt") ;
img = box.getElements ByTagName("img" );
nI = img.length;
resize();
s = ZOOM * 100;
x = 0;
tit.innerHTML = img[0].title;
txt.innerHTML = img[0].alt;
for(i=0; i<nI; i++) {
O[i] = new CObj(i, s, x, img[i].alt, img[i].title);
img[i].alt = "";
img[i].title = "";
img[i].onmousedown = new Function("retur n false;");
x += s;
s = 100;
}
O[0].is.style.curso r = "default";
setTimeout("box .style.visibili ty='visible';", 100);
run();
}
function MM_swapImgResto re() { //v3.0
var i,x,a=document. MM_sr; for(i=0;a&&i<a. length&&(x=a[i])&&x.oSrc;i++ ) x.src=x.oSrc;
}
function MM_preloadImage s() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.leng th,a=MM_preload Images.argument s; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!= 0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf ("?"))>0&&paren t.frames.length ) {
d=parent.frames[n.substring(p+1 )].document; n=n.substring(0 ,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.fo rms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.l ayers&&i<d.laye rs.length;i++) x=MM_findObj(n, d.layers[i].document);
if(!x && d.getElementByI d) x=d.getElementB yId(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_sw apImage.argumen ts; document.MM_sr= new Array; for(i=0;i<(a.le ngth-2);i+=3)
if ((x=MM_findObj( a[i]))!=null){docum ent.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->[/code][code=html]
</script>
</head>
<body onLoad="MM_prel oadImages('imag es/legion1.png')">
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th scope="col"><a href="index.htm l" onMouseOut="MM_ swapImgRestore( )" onMouseOver="MM _swapImage('Ima ge8','','images/legion1.png',1) "><img src="images/legion.png" name="Image8" width="257" height="57" border="0"></a></th>
<th scope="col"> </th>
<th scope="col"> </th>
</tr>
</table>
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th scope="col"> </th>
<div id="box" style="position :absolute; border:gray solid 1px;visibility: hidden;">
<img onClick="O[0].clic();" src="newborn.jp g" title="The MusicRoom Series" alt="They explained a little about what they were doing.">
<img onClick="O[1].clic();" src="majesty.jp g" title="The MusicRoom Series" alt="I hoped I wouldn´t crack under the strain.">
<img onClick="O[2].clic();" src="whitemagic .jpg" title="The MusicRoom series" alt="Clearly they were ready to do almost anything to retain their position.">
<img onClick="O[3].clic();" src="gazebo2k3. jpg" title="The MusicRoom Series" alt="I observed the face of power at its most mundane.">
<img onClick="O[4].clic();" src="pyre.jpg" title="The MusicRoom Series" alt="But they couldn´t hide the very worst of their inhumane undertakings from the people.">
<img onClick="O[5].clic();" src="singularit y.jpg" title="disdain" alt="They showed their utter, complete disdain for justice.">
<img onClick="O[6].clic('http://www.dhteumeuleu .com');" src="spellcraft .jpg" title="never again" alt="Never more. Never again.">
<span id="txt"></span>
<span id="tit"></span>
</div>
<!-- crossbrowser images_loading_ bar - Gerard Ferrandez - www.dhteumeuleu.com - Feb 2005 -->
<span id=LB0 style="position :absolute;left: 50%;top:50%;">< span style="position :absolute;font-family:arial;fo nt-size:10px;color :#FFFFFF;left:-50;top:-18">Loading.. .</span>
<span style="position :absolute;left:-50;top:-5;font-size:1px;width: 100;height:10px ;background:#33 3"><span id=LB1 style="position :absolute;left: 0;top:0;font-size:1px;width: 0;height:10px;b ackground:#FFFF FF"></span></span></span>
<script>m00=doc ument.getElemen tById("box").ge tElementsByTagN ame("img");m01= m00.length; function images_loading_ bar(){m02=0;for (i=0;i<m01;i++) m02+=(m00[i].complete)?1:0; document.getEle mentById("LB1") .style.width=Ma th.round(m02/m01*100); if(m02==m01)set Timeout("docume nt.getElementBy Id('LB0').style .display='none' ",128); else setTimeout("ima ges_loading_bar ()", 64);};images_lo ading_bar();</script>
<!-- end of images_loading_ bar code -->
</tr>
</table>
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th scope="col"> </th>
</tr>
</table>
<p> </p>
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th height="201" bgcolor="d8d8d8 " scope="col"> </th>
</tr>
</table>
<p> </p>
</body>
</html>
____[/code]_______________ _______________ _____________
this may not be an advanced problem but to me it is
i got a great looking slide show script from this site (http://www.dhteumeuleu.com) but am having a lot of trouble adapting it to my needs. the problem is that when i add a rollover hyperlink to/in the page the slide show ceases to work. i hope somebody can help me with this. i have included the code with the rollover so you can see where i'm going wrong, to see the slideshow as it should look go to the website above
_______________ _______________ _______________ _____
_____[code=html]
<html>
<head>
<title>imgPre ss - Interactive DHTML art-demos</title>
<meta name="author" content="Gerard Ferrandez at http://www.dhteumeuleu .com">
<meta http-equiv="imagetoo lbar" content="no">
<style type="text/css">
body {margin:0; padding:0; position:absolu te; overflow:hidden ; background:#e8e 8e8; left:0; top:0; width:1000%; height:100%;}
img {position:absol ute; border:gray solid 1px; cursorointer; width:257px; }
span {position:absol ute; color:#ccc; font-family:verdana; font-size: 12px; width:200px;}
</style>
<script type="text/javascript">[/code][code=javascript]
<!--
// =============== =============== =============== =====
==
// script: Gerard Ferrandez - Ge-1-doot - JANUARY 2005
// news://news.leibowitz.org/nzn.fr.html
// http://www.dhteumeuleu.com/
// crossbrowser DOM
// =============== =============== =============== =====
==
window.onerror = new Function("retur n true");
document.onsele ctstart = new Function("retur n false");
screen.bufferDe pth = 16;
O = new Array();
box = 0;
img = 0;
txt = 0;
tit = 0;
W = 0;
H = 0;
nI = 0;
sel = 0;
si = 0;
//////////////////
ZOOM = 4;
rImg = 1.33;
speed = .1;
//////////////////
function dText(){
txt.style.textA lign = tit.style.textA lign = (sel<nI/2)?"left":"righ t";
txt.innerHTML = O[sel].tx;
tit.innerHTML = O[sel].ti;
}
function CObj(n, s, x, tx, ti){
this.n = n;
this.dim = s;
this.tx = tx;
this.ti = ti;
this.is = img[n];
this.vz = 0;
this.sx = 0;
this.x0 = x;
this.x1 = 0;
this.zo = 0;
this.clic = function(hlink) {
with(this){
if(n!=sel){
O[sel].is.style.curso r = "pointer";
if(!hlink)O[n].is.style.curso r = "default";
O[sel].dim = 100;
O[n].dim = ZOOM * 100;
sel = n;
l = 0;
for(k=0; k<nI; k++){
O[k].x0 = l;
l += O[k].dim;
}
txt.innerHTML = tit.innerHTML = "";
setTimeout("dTe xt()", 32);
} else {
// ==== open hyperlink window
if(hlink)window .open(hlink,"_b lank");
}
}
}[/code][code=javascript]
this.anim = function () {
with(this){
vz = speed*(vz+(x1-sx)*.5);
x1 -= vz;
sx = (n==0)?0:O[n-1].x0+O[n-1].dim;
zo -= (zo-dim)*speed;
l = Math.round((x1* si)+6*(n+1));
w = Math.round(zo*s i);
is.style.left = l;
is.style.top = (H-w*rImg)*.5;
is.style.width = w;
is.style.height = w*rImg;
if(sel == n){
if(sel<nI*.5)ti t.style.left = txt.style.left = l+w+6;
else tit.style.left = txt.style.left = l-(nx*.25)-6;
txt.style.top = -(w*rImg)*.25;
tit.style.top = (w*rImg)*.33;
}
}
}
}
function run(){
for(j in O)O[j].anim();
setTimeout("run ()", 16);
}
function doResize(){
tit.style.width = nx*.25;
txt.style.width = nx*.25;
tit.style.fontS ize = (nx / 30) + "px";
txt.style.fontS ize = (nx / 70) + "px";
with(box.style) {
width = W;
height = H;
left = nx / 2 - W / 2;
top = ny / 2 - H / 2;
}
}[/code][code=javascript]
function resize(){
nx = document.body.o ffsetWidth;
ny = document.body.o ffsetHeight;
W = nx * 90 / 100;
si = (W-((nI+1)*6))/((ZOOM*100)+((n I-1)*100));
H = (100 * si * rImg) + 14;
setTimeout("doR esize()", 16);
}
onresize = resize;
onload = function(){
box = document.getEle mentById("box") ;
tit = document.getEle mentById("tit") ;
txt = document.getEle mentById("txt") ;
img = box.getElements ByTagName("img" );
nI = img.length;
resize();
s = ZOOM * 100;
x = 0;
tit.innerHTML = img[0].title;
txt.innerHTML = img[0].alt;
for(i=0; i<nI; i++) {
O[i] = new CObj(i, s, x, img[i].alt, img[i].title);
img[i].alt = "";
img[i].title = "";
img[i].onmousedown = new Function("retur n false;");
x += s;
s = 100;
}
O[0].is.style.curso r = "default";
setTimeout("box .style.visibili ty='visible';", 100);
run();
}
function MM_swapImgResto re() { //v3.0
var i,x,a=document. MM_sr; for(i=0;a&&i<a. length&&(x=a[i])&&x.oSrc;i++ ) x.src=x.oSrc;
}
function MM_preloadImage s() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.leng th,a=MM_preload Images.argument s; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!= 0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf ("?"))>0&&paren t.frames.length ) {
d=parent.frames[n.substring(p+1 )].document; n=n.substring(0 ,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.fo rms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.l ayers&&i<d.laye rs.length;i++) x=MM_findObj(n, d.layers[i].document);
if(!x && d.getElementByI d) x=d.getElementB yId(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_sw apImage.argumen ts; document.MM_sr= new Array; for(i=0;i<(a.le ngth-2);i+=3)
if ((x=MM_findObj( a[i]))!=null){docum ent.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->[/code][code=html]
</script>
</head>
<body onLoad="MM_prel oadImages('imag es/legion1.png')">
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th scope="col"><a href="index.htm l" onMouseOut="MM_ swapImgRestore( )" onMouseOver="MM _swapImage('Ima ge8','','images/legion1.png',1) "><img src="images/legion.png" name="Image8" width="257" height="57" border="0"></a></th>
<th scope="col"> </th>
<th scope="col"> </th>
</tr>
</table>
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th scope="col"> </th>
<div id="box" style="position :absolute; border:gray solid 1px;visibility: hidden;">
<img onClick="O[0].clic();" src="newborn.jp g" title="The MusicRoom Series" alt="They explained a little about what they were doing.">
<img onClick="O[1].clic();" src="majesty.jp g" title="The MusicRoom Series" alt="I hoped I wouldn´t crack under the strain.">
<img onClick="O[2].clic();" src="whitemagic .jpg" title="The MusicRoom series" alt="Clearly they were ready to do almost anything to retain their position.">
<img onClick="O[3].clic();" src="gazebo2k3. jpg" title="The MusicRoom Series" alt="I observed the face of power at its most mundane.">
<img onClick="O[4].clic();" src="pyre.jpg" title="The MusicRoom Series" alt="But they couldn´t hide the very worst of their inhumane undertakings from the people.">
<img onClick="O[5].clic();" src="singularit y.jpg" title="disdain" alt="They showed their utter, complete disdain for justice.">
<img onClick="O[6].clic('http://www.dhteumeuleu .com');" src="spellcraft .jpg" title="never again" alt="Never more. Never again.">
<span id="txt"></span>
<span id="tit"></span>
</div>
<!-- crossbrowser images_loading_ bar - Gerard Ferrandez - www.dhteumeuleu.com - Feb 2005 -->
<span id=LB0 style="position :absolute;left: 50%;top:50%;">< span style="position :absolute;font-family:arial;fo nt-size:10px;color :#FFFFFF;left:-50;top:-18">Loading.. .</span>
<span style="position :absolute;left:-50;top:-5;font-size:1px;width: 100;height:10px ;background:#33 3"><span id=LB1 style="position :absolute;left: 0;top:0;font-size:1px;width: 0;height:10px;b ackground:#FFFF FF"></span></span></span>
<script>m00=doc ument.getElemen tById("box").ge tElementsByTagN ame("img");m01= m00.length; function images_loading_ bar(){m02=0;for (i=0;i<m01;i++) m02+=(m00[i].complete)?1:0; document.getEle mentById("LB1") .style.width=Ma th.round(m02/m01*100); if(m02==m01)set Timeout("docume nt.getElementBy Id('LB0').style .display='none' ",128); else setTimeout("ima ges_loading_bar ()", 64);};images_lo ading_bar();</script>
<!-- end of images_loading_ bar code -->
</tr>
</table>
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th scope="col"> </th>
</tr>
</table>
<p> </p>
<table width="950" border="0" cellspacing="0" cellpadding="0" >
<tr>
<th height="201" bgcolor="d8d8d8 " scope="col"> </th>
</tr>
</table>
<p> </p>
</body>
</html>
____[/code]_______________ _______________ _____________
Comment