File html con procedure javascript per creare effetto libro da sfogliare

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Buonasera a tutti, ringraziando gli esperti sempre solerti vado a porre una questione che spero sia di semplice risposta, ho trovato questo script che crea un effetto libro con immagini a sequenza.... ma ho notato che sta usando i div per creare il box dove inserire il riquadro poi delle immagini sulla pagina.
Chiaramente usa gli attributi absolute e cosi il div non si muove dal centro della pagina e invece io vorrei come al mio solito inserirlo in una tabella dove nelle altre celle metto altre cose... ma ammetto la mia ignoranza non sapendo come togliere il parametro dv e sostituire il codice :((
Sono riucito a sfrondare il codice originale di tante cose inutili, ho assegnato le class per evitare problemi con il css, ma i dv no...
Vi posto il contenuto e immaginate che desidero usare una tabella 2 x 2, è possibile un vostro aiuto ??

HTML:
<HTML class="librone">

<HEAD>

<meta http-equiv="imagetoolbar" content="no">
<style type="text/css">

<!-- 
	html.librone {
		overflow: hidden;
	}

	body.libro {
		margin: 0px;
		padding: 0px;
		background:trasparent;
		
		width: 100%;
		height: 100%;
		
	}

	#center {
		position:absolute;
		left: 50%;
		top: 50%;
	}
	#DHTMLBOOK {
		position: relative;
		background: #000;
		width: 420px;
		height: 320px;
		left: -210px;
		top: -160px;
		visibility: hidden;
	}
	#TXTBOX {
		position: relative;
		font-family: verdana;
		color: #aba193;
		font-size: .8em;
		width: 410px;
		text-align: center;
		top: 320px;
	}
	.page {
		position: absolute;
		overflow: hidden;
		width: 50%;
		height: 100%;
		border-left: #000000 solid 1px;
	}
	.right {
		left: 50%;
		border-right: #000000 solid 1px;
	}
	.turn {
		background: trasparent;
	}
	
      .img {
		position: absolute;
		height: 100%;
		width: 200%;
	}
 -->	
	
</style>

<script type="text/javascript">
 <!--  

document.onselectstart = function () { return false; }

var nI  = 0;
var kI  = 0;
var run = false;

function setOpacity(obj,o) {
	if (o<0) o=0; else if (o>100) o = 100;
	if (obj.filters)obj.filters.alpha.opacity=o; else obj.style.opacity = o/100;
}
function TPR__(p) {
	P1.style.left  = 50-(2.5*p)+"%";
	P1.style.width = (2.5*p)+"%";
	setOpacity(P1i, .5*p*p);
	if (p == 20) run = false;
}
function TPR_(p) {
	P2.style.width = 50-(2.5*p)+"%";
	setOpacity(P2i, 100-.5*(p*p));
	if (p == 20) {
		P2i.src = IMGSRC[kI].src;
		setOpacity(P2i, 100);
		P2.style.width = "50%";
		for(var i=1; i<=20; i++) setTimeout("TPR__("+i+")", i*32);
	}
}
function TPR() {
	if (!run) {
		run = true;
		P01i.src = IMGSRC[kI].src;
		P1.style.width = 0;
		kI++;
		if (kI>=nI) kI = 0;
		titLe(kI);
		P02i.src = IMGSRC[kI].src;
		P1i.src  = IMGSRC[kI].src;
		for (var i=1; i<=20; i++) setTimeout("TPR_("+i+")", i*32);
	} else setTimeout("TPR()", 100);
}

function TPL__(p) {
	P2.style.width = (2.5*p)+"%";
	setOpacity(P2i, .5*p*p);
	if (p == 20) run = false;
}
function TPL_(p) {
	P1.style.left  = (2.5*p)+"%";
	P1.style.width = 40+(10-2.5*p)+"%";
	setOpacity(P1i, 100-.5*(p*p));
	if (p == 20) {
		P1i.src = IMGSRC[kI].src;
		setOpacity(P1i, 100);
		P1.style.left  = 0;
		P1.style.width = "50%";
		for(var i=1; i<=20; i++) setTimeout("TPL__("+i+")", i*32);
	}
}
function TPL() {
	if (!run) {
		run = true;
		P02i.src = IMGSRC[kI].src;
		P2.style.width = 0;
		kI--;
		if (kI < 0) kI = nI-1;
		titLe(kI);
		P01i.src = IMGSRC[kI].src;
		P2i.src  = IMGSRC[kI].src;
		for(var i=1; i<=20; i++) setTimeout("TPL_("+i+")", i*32);
	} else setTimeout("TPL()", 100);
}

function titLe(p) {
	document.getElementById("TXTBOX").innerHTML = IMGSRC[p].alt;
}


onload = function() {
	IMGSRC  = document.getElementById("imgsrc").getElementsByTagName("img");
	DB      = document.getElementById("DHTMLBOOK");
	P01     = DB.getElementsByTagName("span")[0];
	P01i    = P01.getElementsByTagName("img")[0];
	P02     = DB.getElementsByTagName("span")[1];
	P02i    = P02.getElementsByTagName("img")[0];
	P1      = DB.getElementsByTagName("span")[2];
	P1i     = P1.getElementsByTagName("img")[0];
	P2      = DB.getElementsByTagName("span")[3];
	P2i     = P2.getElementsByTagName("img")[0];
	nI      = IMGSRC.length;
	P1i.src = IMGSRC[kI].src;
	P2i.src = IMGSRC[kI].src;
	titLe(kI);
	DB.style.visibility = "visible";
}
// -->
</script>

</head>



<body class="libro">

<div id="center">
	<div id="DHTMLBOOK">
		<span class="page" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img"></span>
		<span class="page right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="left:-100%"></span>
		<span class="page turn" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img" style="opacity:1;filter:alpha()"></span>
		<span class="page turn right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="opacity:1;filter:alpha();left:-100%"></span>
		<div id="TXTBOX"></div>
	</div>
</div>

<div id="imgsrc" style="visibility:hidden;">
        <img alt="descrizione immagine 1" src="http://4.bp.blogspot.com/-IR8M7jqaZFU/UB2Rq7D_llI/AAAAAAAAA7Q/2TlECVPWl-c/s1600/Isaac+Asimov.jpg">
	<img alt="descrizione immagine 2" src="http://4.bp.blogspot.com/-zFssZZQ1Yvg/UBsmugxz7YI/AAAAAAAAA1s/eW-vDZl9Bwk/s1600/oscar_wilde.jpg">
	<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike
</div>
 
</body>

</HTML>

Grazie in anticipato :))
Domenico.
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Precisazione

Non desidero usare i parametri dv perchè poi questi script finiscono nel mio blog in piattaforma blogger e i div non sono molto ben gestiti dai gadget html ... non per una antipatia o un non volerli comprendere... tanto li sto studiando lo stesso :)
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Provato con le tabelle

ho modificato cosi :

HTML:
<body class="libro">

<table style="text-align: left; width:100%;"
 border="3" cellpadding="2" cellspacing="2">
    <tr>
      <td id="center">
	<p id="DHTMLBOOK">
		<span class="page" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img"></span>
		<span class="page right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="left:-100%"></span>
		<span class="page turn" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img" style="opacity:1;filter:alpha()"></span>
		<span class="page turn right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="opacity:1;filter:alpha();left:-100%"></span>
		<p id="TXTBOX"></p>
	</p>
           </td>
    </tr>
<tr>
<td id="imgsrc" style="visibility:hidden;">
        <img alt="descrizione immagine 1" src="http://4.bp.blogspot.com/-IR8M7jqaZFU/UB2Rq7D_llI/AAAAAAAAA7Q/2TlECVPWl-c/s1600/Isaac+Asimov.jpg">
	<img alt="descrizione immagine 2" src="http://4.bp.blogspot.com/-zFssZZQ1Yvg/UBsmugxz7YI/AAAAAAAAA1s/eW-vDZl9Bwk/s1600/oscar_wilde.jpg">
	<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike

</td>
    </tr>


</body>

in effetti lo script funziona ma spuntano due tabelle una sopra e una a lato e il testo dell'alt dell'immagine scomparso.... :((
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao,
dopo un po mi sono arreso :hammer:
di seguito alcune annotazioni
Codice:
html.librone, body.libro
Non ha senso dare un classe al body o all'html

Codice:
background-color:transparent;
width: 100%;
height: 100%;
non hanno senso sul body

Codice:
<meta http-equiv="imagetoolbar" content="no">
mai visto prima
Codice:
.turn {
  background: trasparent;
}
semmai transparent

Codice:
document.onselectstart = function () { 
   return false; 
}
non ne capisco l'utilità

Codice:
onmousedown="return false;"
???? a che serve?

Codice:
ondblclick="TPL();" onclick="TPL();
onclick non basta?

Codice:
filter:alpha()
al massimo filter:alpha;

Codice:
<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike
manca un pezzo

Auguri
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Scusami

Scusami se te lo chiedo molto gentilmente.... hai ragione è un casotto e poco alla volta sto cercando di mettere ordine.... se ti va la mia domanda è un'altra... puoi darmi una mano ad eliminare i div sostituendoli con una tabella ??? solo questo se ti va ed è possibile... :)))
Grazie...
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Corretto secondo indicazioni

Ho corretto il file secondo le indicazioni ed eccolo qua :

HTML:
<HTML>

<HEAD>


<style type="text/css">

<!-- 

	#center {
		position:absolute;
		left: 50%;
		top: 50%;
	}
	#DHTMLBOOK {
		position: relative;
		background: #000;
		width: 420px;
		height: 320px;
		left: -210px;
		top: -160px;
		visibility: hidden;
	}
	#TXTBOX {
		position: relative;
		font-family: verdana;
		color: #aba193;
		font-size: .8em;
		width: 410px;
		text-align: center;
		top: 320px;
	}
	.page {
		position: absolute;
		overflow: hidden;
		width: 50%;
		height: 100%;
		border-left: #000000 solid 1px;
	}
	.right {
		left: 50%;
		border-right: #000000 solid 1px;
	}
	.turn {
		background: transparent;
	}
	
      .img {
		position: absolute;
		height: 100%;
		width: 200%;
	}
 -->	
	
</style>

<script type="text/javascript">
 <!--  

document.onselectstart = function () { return false; }

var nI  = 0;
var kI  = 0;
var run = false;

function setOpacity(obj,o) {
	if (o<0) o=0; else if (o>100) o = 100;
	if (obj.filters)obj.filters.alpha.opacity=o; else obj.style.opacity = o/100;
}
function TPR__(p) {
	P1.style.left  = 50-(2.5*p)+"%";
	P1.style.width = (2.5*p)+"%";
	setOpacity(P1i, .5*p*p);
	if (p == 20) run = false;
}
function TPR_(p) {
	P2.style.width = 50-(2.5*p)+"%";
	setOpacity(P2i, 100-.5*(p*p));
	if (p == 20) {
		P2i.src = IMGSRC[kI].src;
		setOpacity(P2i, 100);
		P2.style.width = "50%";
		for(var i=1; i<=20; i++) setTimeout("TPR__("+i+")", i*32);
	}
}
function TPR() {
	if (!run) {
		run = true;
		P01i.src = IMGSRC[kI].src;
		P1.style.width = 0;
		kI++;
		if (kI>=nI) kI = 0;
		titLe(kI);
		P02i.src = IMGSRC[kI].src;
		P1i.src  = IMGSRC[kI].src;
		for (var i=1; i<=20; i++) setTimeout("TPR_("+i+")", i*32);
	} else setTimeout("TPR()", 100);
}

function TPL__(p) {
	P2.style.width = (2.5*p)+"%";
	setOpacity(P2i, .5*p*p);
	if (p == 20) run = false;
}
function TPL_(p) {
	P1.style.left  = (2.5*p)+"%";
	P1.style.width = 40+(10-2.5*p)+"%";
	setOpacity(P1i, 100-.5*(p*p));
	if (p == 20) {
		P1i.src = IMGSRC[kI].src;
		setOpacity(P1i, 100);
		P1.style.left  = 0;
		P1.style.width = "50%";
		for(var i=1; i<=20; i++) setTimeout("TPL__("+i+")", i*32);
	}
}
function TPL() {
	if (!run) {
		run = true;
		P02i.src = IMGSRC[kI].src;
		P2.style.width = 0;
		kI--;
		if (kI < 0) kI = nI-1;
		titLe(kI);
		P01i.src = IMGSRC[kI].src;
		P2i.src  = IMGSRC[kI].src;
		for(var i=1; i<=20; i++) setTimeout("TPL_("+i+")", i*32);
	} else setTimeout("TPL()", 100);
}

function titLe(p) {
	document.getElementById("TXTBOX").innerHTML = IMGSRC[p].alt;
}


onload = function() {
	IMGSRC  = document.getElementById("imgsrc").getElementsByTagName("img");
	DB      = document.getElementById("DHTMLBOOK");
	P01     = DB.getElementsByTagName("span")[0];
	P01i    = P01.getElementsByTagName("img")[0];
	P02     = DB.getElementsByTagName("span")[1];
	P02i    = P02.getElementsByTagName("img")[0];
	P1      = DB.getElementsByTagName("span")[2];
	P1i     = P1.getElementsByTagName("img")[0];
	P2      = DB.getElementsByTagName("span")[3];
	P2i     = P2.getElementsByTagName("img")[0];
	nI      = IMGSRC.length;
	P1i.src = IMGSRC[kI].src;
	P2i.src = IMGSRC[kI].src;
	titLe(kI);
	DB.style.visibility = "visible";
}
// -->
</script>

</head>



<body>

<table style="text-align: left; width:100%;"
 border="3" cellpadding="2" cellspacing="2">
    <tr>
      <td id="center">
	<p id="DHTMLBOOK">
		<span class="page"  ondblclick="TPL();" onclick="TPL();"><img class="img"></span>
		<span class="page right"  ondblclick="TPR();" onclick="TPR();"><img class="img" style="left:-100%"></span>
		<span class="page turn"  ondblclick="TPL();" onclick="TPL();"><img class="img" style="opacity:1;filter:alpha;"></span>
		<span class="page turn right" ondblclick="TPR();" onclick="TPR();"><img class="img" style="opacity:1;filter:alpha;left:-100%"></span>
		<p id="TXTBOX"></p>
	</p>
           </td>
    </tr>
<tr>
<td id="imgsrc" style="visibility:hidden;">
        <img alt="descrizione immagine 1" src="http://4.bp.blogspot.com/-IR8M7jqaZFU/UB2Rq7D_llI/AAAAAAAAA7Q/2TlECVPWl-c/s1600/Isaac+Asimov.jpg">
	<img alt="descrizione immagine 2" src="http://4.bp.blogspot.com/-zFssZZQ1Yvg/UBsmugxz7YI/AAAAAAAAA1s/eW-vDZl9Bwk/s1600/oscar_wilde.jpg">
	<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike47mvA/s1600/io_sono_leggenda.jpg">
</td>
    </tr>


</body>

</HTML>

Mi resta sempre lo stesso problema... togliere i div e inserire l'immagine dinamica in una tabella :)
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao
prova a trasformare i div in questa maniera (al massimo non funzia)
HTML:
<table width="100%"  border="0" align="center" cellpadding="0" cellspacing="0">
	<tr id="DHTMLBOOK">
    	<td width="50%">
			<span class="page" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img"></span>
			<span class="page right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="left:-100%"></span>
			<span class="page turn" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img" style="opacity:1;filter:alpha()"></span>
			<span class="page turn right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="opacity:1;filter:alpha();left:-100%"></span>
		</td>
    	<td id="TXTBOX"></td>
	</tr>
	<tr id="imgsrc" style="visibility:hidden;">
		<td colspan="2">
			<img alt="descrizione immagine 1" src="http://4.bp.blogspot.com/-IR8M7jqaZFU/UB2Rq7D_llI/AAAAAAAAA7Q/2TlECVPWl-c/s1600/Isaac+Asimov.jpg">
			<img alt="descrizione immagine 2" src="http://4.bp.blogspot.com/-zFssZZQ1Yvg/UBsmugxz7YI/AAAAAAAAA1s/eW-vDZl9Bwk/s1600/oscar_wilde.jpg">
			<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike47mvA/s1600/io_sono_leggenda.jpg">
		</td>
	</tr>
</table>
però alle classi e/o id che si riferiscono ai tr e td nel css togli i riferimenti alle posizioni che per i tr e td non hanno senzo
 
Ultima modifica:

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Non funziona

Infatti non funziona
Ho provato cosi :
HTML:
<table style="text-align: center; width: 80%;" border="2" cellpadding="2" cellspacing="2">
    <tr>
        <td>
      <table style="text-align: left; width: 80%;" border="1"
 cellpadding="2" cellspacing="2">
          <tr>
            <td id="DHTMLBOOK">   
                <span class="page"  ondblclick="TPL();" onclick="TPL();"><img class="img"></span>
		<span class="page right"  ondblclick="TPR();" onclick="TPR();"><img class="img" style="left:-100%"></span>
		<span class="page turn"  ondblclick="TPL();" onclick="TPL();"><img class="img" style="opacity:1;filter:alpha;"></span>
		<span class="page turn right" ondblclick="TPR();" onclick="TPR();"><img class="img" style="opacity:1;filter:alpha;left:-100%"></span>
       
<table style="text-align: center; width: 80%;" border="1"
 cellpadding="2" cellspacing="2">
          <tr>  <td id="TXTBOX"></td></tr></table>
          </td></tr></table>
             
<table style="text-align: left; width: 80%;" border="1"
 cellpadding="2" cellspacing="2"> 
<tr>
            <td id="imgsrc" style="visibility:hidden;"> 
        <img alt="descrizione immagine 1" src="http://4.bp.blogspot.com/-IR8M7jqaZFU/UB2Rq7D_llI/AAAAAAAAA7Q/2TlECVPWl-c/s1600/Isaac+Asimov.jpg">
	<img alt="descrizione immagine 2" src="http://4.bp.blogspot.com/-zFssZZQ1Yvg/UBsmugxz7YI/AAAAAAAAA1s/eW-vDZl9Bwk/s1600/oscar_wilde.jpg">
	<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike47mvA/s1600/io_sono_leggenda.jpg">
</td></tr></table>

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

cioè a posto dei box dei vari id ho creato delle celle interne....
ma purtroppo di sicuro in tutto il codice bisognerebbe cambiare ad hoc, come ad esempio il comando <span , in effetti non crea pure lui un box ???

Si può provare a riscriverlo l'intero codice evitando a priori qualsiasi tipo di box o contenitori ???
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Guardando bene tutto il codice la funzione da cambiare me sa che è : onload = function()... me la sto studiando passo passo.... ma ... :)
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Altra prova

Ho provato a fare secondo l'esperienza di script già visti e elaborati e funzionanti una cosa similare :

HTML:
<HTML>

<HEAD>


<style type="text/css">

<!-- 

          
 -->	
	
</style>



</head>



<body>

<table style="text-align: center; width: 80%;" border="2" cellpadding="2" cellspacing="2">
    <tr>
        <td id="DHTMLBOOK">

                <span class="page" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img"></span>
		<span class="page right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="left:-100%"></span>
		<span class="page turn" onmousedown="return false;" ondblclick="TPL();" onclick="TPL();"><img class="img" style="opacity:1;filter:alpha()"></span>
		<span class="page turn right" onmousedown="return false;" ondblclick="TPR();" onclick="TPR();"><img class="img" style="opacity:1;filter:alpha();left:-100%"></span>
     

</td> 

<td id="TXTBOX"></td> 
   </tr>
      
<tr> <td id="imgsrc" style="visibility:hidden;">
<img alt="descrizione immagine 1" src="http://4.bp.blogspot.com/-IR8M7jqaZFU/UB2Rq7D_llI/AAAAAAAAA7Q/2TlECVPWl-c/s1600/Isaac+Asimov.jpg">
	<img alt="descrizione immagine 2" src="http://4.bp.blogspot.com/-zFssZZQ1Yvg/UBsmugxz7YI/AAAAAAAAA1s/eW-vDZl9Bwk/s1600/oscar_wilde.jpg">
	<img alt="descrizione immagine 3" src="http://3.bp.blogspot.com/-BdDkKYnUosI/UBsmuEwfYPI/AAAAAAAAA1k/QHCike

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




<script type="text/javascript">
 <!--  

document.onselectstart = function () { return false; }

var nI  = 0;
var kI  = 0;
var run = false;

function setOpacity(obj,o) {
	if (o<0) o=0; else if (o>100) o = 100;
	if (obj.filters)obj.filters.alpha.opacity=o; else obj.style.opacity = o/100;
}
function TPR__(p) {
	P1.style.left  = 50-(2.5*p)+"%";
	P1.style.width = (2.5*p)+"%";
	setOpacity(P1i, .5*p*p);
	if (p == 20) run = false;
}
function TPR_(p) {
	P2.style.width = 50-(2.5*p)+"%";
	setOpacity(P2i, 100-.5*(p*p));
	if (p == 20) {
		P2i.src = IMGSRC[kI].src;
		setOpacity(P2i, 100);
		P2.style.width = "50%";
		for(var i=1; i<=20; i++) setTimeout("TPR__("+i+")", i*32);
	}
}
function TPR() {
	if (!run) {
		run = true;
		P01i.src = IMGSRC[kI].src;
		P1.style.width = 0;
		kI++;
		if (kI>=nI) kI = 0;
		titLe(kI);
		P02i.src = IMGSRC[kI].src;
		P1i.src  = IMGSRC[kI].src;
		for (var i=1; i<=20; i++) setTimeout("TPR_("+i+")", i*32);
	} else setTimeout("TPR()", 100);
}

function TPL__(p) {
	P2.style.width = (2.5*p)+"%";
	setOpacity(P2i, .5*p*p);
	if (p == 20) run = false;
}
function TPL_(p) {
	P1.style.left  = (2.5*p)+"%";
	P1.style.width = 40+(10-2.5*p)+"%";
	setOpacity(P1i, 100-.5*(p*p));
	if (p == 20) {
		P1i.src = IMGSRC[kI].src;
		setOpacity(P1i, 100);
		P1.style.left  = 0;
		P1.style.width = "50%";
		for(var i=1; i<=20; i++) setTimeout("TPL__("+i+")", i*32);
	}
}
function TPL() {
	if (!run) {
		run = true;
		P02i.src = IMGSRC[kI].src;
		P2.style.width = 0;
		kI--;
		if (kI < 0) kI = nI-1;
		titLe(kI);
		P01i.src = IMGSRC[kI].src;
		P2i.src  = IMGSRC[kI].src;
		for(var i=1; i<=20; i++) setTimeout("TPL_("+i+")", i*32);
	} else setTimeout("TPL()", 100);
}

function titLe(p) {
	document.getElementById("txtbox").innerHTML = IMGSRC[p].alt;
}


       function inserimento() {
	IMGSRC  = document.getElementById("imgsrc").getElementsByTagName("img");
	DB      = document.getElementById("DHTMLBOOK");
	P01     = DB.getElementsByTagName("span")[0];
	P01i    = P01.getElementsByTagName("img")[0];
	P02     = DB.getElementsByTagName("span")[1];
	P02i    = P02.getElementsByTagName("img")[0];
	P1      = DB.getElementsByTagName("span")[2];
	P1i     = P1.getElementsByTagName("img")[0];
	P2      = DB.getElementsByTagName("span")[3];
	P2i     = P2.getElementsByTagName("img")[0];
	nI      = IMGSRC.length;
	P1i.src = IMGSRC[kI].src;
	P2i.src = IMGSRC[kI].src;
	titLe(kI);
	DB.style.visibility = "visible";
}

</script>


</body>

</HTML>

ma ti pareva che andasse.... :(( potete per cortesia dargli uno sguardo....
ho sostituito i vari id con inserimenti in tabella con : id = " xxx" ;.... ma non li legge ...
 
Discussioni simili
Autore Titolo Forum Risposte Data
L problema collegamento file css con html HTML e CSS 1
K Aiuto con file audio in html HTML e CSS 1
G Campo HTML input file con jQuery jQuery 0
Joker37 Generare file txt con php estraendo codice html. PHP 4
S Form invio mail html, con invio tramite file denominato invio.php PHP 8
D Problema collegamento file css con html HTML e CSS 4
L come passare il campo allegato dal file html al fiel php per spedirlo con un form PHP 12
M Adattare script di "form mail con upload file" al mio form mail HTML! PHP 7
L Creazione tabella Html con popolazione dati da file di testo (txt) Ajax 12
G file css con html HTML e CSS 9
asevenx inserire tag html con un file esterno HTML e CSS 2
L scrittura su file html con ritormo a capo PHP 6
G caricare file midi esterni tramite javascript inserito nella pagina html generata con Flash 0
K File audio in html, chi mi può aiutare? HTML e CSS 0
Antonio67 Lanciare file shell bash da html HTML e CSS 2
L Ricezione dei dati su file php da modulo html PHP 6
W visualizzare solo file html e sottocartelle di una cartella PHP 1
N Script elenco file HTML HTML e CSS 5
V Servizio design pagina web e download in self contained html file Discussioni Varie 1
napuleone [HTML] type="file" inserire path di partenza HTML e CSS 4
F [PHP] Importare file CSV in HTML PHP 12
E [HTML] non apre link a file locale ma se lo imposto su barra indirizzi lo apre HTML e CSS 3
F [PHP] Importare file CSV in HTML PHP 3
T [Javascript] Richiamare un file.js (iframe) in html Javascript 1
C [PHP] Pagina html che legge file txt PHP 41
F [PHP] [HTML] File legato ad action in un form PHP 1
bubino8 [HTML] <input type="file"> Testo a scelta HTML e CSS 3
D Elenco File cartella solo HTML HTML e CSS 7
Z Modifica ricorsiva file html HTML e CSS 3
manugonn [PHP] [HTML] SCRITTURA SU FILE TXT DA FORM PHP 11
A [HTML+CSS] footer che si aggiorna da un file esterno HTML e CSS 22
michele357 TAG HTML: Come evitare che venga riprodotto un file .mp3 senza cancellarlo HTML e CSS 1
M [Joomla] file di configurazione html Joomla 4
utente testo scorrevole html da file txt o xml HTML e CSS 6
localhost.nicola Includere file HTML/TXT su script php PHP 3
Z richiamare codice html in file php PHP 2
A Link ad un file PHP in HTML PHP 0
G Da file txt a tabella html PHP 11
A salvataggio file audio su una seconda pagina html Javascript 0
S apertura file html da sd in chrome Sviluppo app per Android 5
P Includere file php in altro file php, evitando l'html del primo... PHP 0
A link html da file esterno HTML e CSS 19
MarcoGrazia jQuery richiamarne la libreria in file HTML Snippet Javascript 0
filippino Trova e sostituisci codici html su più file contemporaneamente HTML e CSS 4
S sostituire codice html in molti file HTML e CSS 1
C File di testo da html HTML e CSS 2
M Il menu HTML funziona correttamente se richiamato da un file php non funziona più PHP 3
P Upload file html speciale HTML e CSS 3
unkus_nob valori checkbox di form html in file php senza submit PHP 1
C in un file html/javascript caricare i div presenti nel body in un file di testo e richiamarli Javascript 7

Discussioni simili