Consigli su script di animazione div

**andreaciao_22** · 10-07-2007, 15:40

Salve a tutti, io ho questo codice(funzioniMenu.js):

codice:

var MaxMarg = 385;
var MinMarg = 300;
var divIndietro = 5;
var divMilliSecondi = 50;
var LastEle;
var swFatto;
var LastEvt;
function SistemaDiv(){
	var i;
	var DivProva;
	var NomeProva;
	for (i=1;i<4;i++) {
		NomeDiv = "div" + i;
		DivProva = document.getElementById(NomeDiv);
		DivProva.style.marginLeft = MaxMarg + "px";
	}
}

function SpostaDivIndietro(evt, divPadre, divMarg){
	var ele = document.getElementById(divPadre);
	var evt = evt || window.event;
    var targetObj = evt.target||evt.srcElement;
	if (LastEle != null) {
		if (ele.id != LastEle.id) {
			if (swFatto == false) {
				SpostaDivAvanti(LastEvt, LastEle.id, MinMarg)
				swFatto = true;
			}
		}
	}
	ele.style.marginLeft = divMarg + "px";
	divMarg -= divIndietro;
	var ToW = window.setTimeout(function() {SpostaDivIndietro(evt, divPadre, divMarg);}, divMilliSecondi);
	if (divMarg < MinMarg) {
		window.clearTimeout(ToW);
		targetObj.onclick = function(){SpostaDivAvanti(evt, divPadre, MinMarg)};
		LastEle = ele;
		LastEvt = evt;
		LastdivMarg = ele.style.marginLeft;
		swFatto = false;
	}
}

function SpostaDivAvanti(evt, divPadre, divMarg){
	var ele = document.getElementById(divPadre);
	var evt = evt || window.event;
    var targetObj = evt.target||evt.srcElement;
	ele.style.marginLeft = divMarg + "px";
	divMarg += divIndietro;
	var ToW = window.setTimeout(function() {SpostaDivAvanti(evt, divPadre, divMarg);}, divMilliSecondi);
	if (divMarg > MaxMarg) {
		window.clearTimeout(ToW);
		targetObj.onclick = function(){SpostaDivIndietro(evt, divPadre, MaxMarg)};
		return;
	}
}

questa la pagina HTML(Prova.htm):

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<script language="javascript" type="text/javascript" src="/Prove/funzioniMenu.js"></script>
		<link href="/Prove/CSSMenu.css" rel="stylesheet" type="text/css">
		<title>Documento senza titolo</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	</head>
	<body onLoad="SistemaDiv();">
		<div id="container">
			<div id="div1"><div id="click" onClick="SpostaDivIndietro(event, 'div1',385);"></div></div>
			<div id="div2"><div id="click" onClick="SpostaDivIndietro(event, 'div2', 385);"></div></div>
			<div id="div3"><div id="click" onClick="SpostaDivIndietro(event, 'div3', 385);"></div></div>
		</div>
	</body>
</html>

e questo il css(CssMenu.css):

codice:

#container{
	width:400px;
	height:250px;
	margin:5px;
	overflow:hidden;
}
#div1, #div2, #div3{
	margin-top:5px;
	width:100px;
	height:30px;
	background-color:#feaf2e;
	padding:0;
}

#click{
	width:15px;
	height:30px;
	margin:0;
	padding:0;
}

sapreste dirmi se questo codice javascript può andare bene oppure posso applicare altre migliorie? se posso quali sono tali migliorie?

come posso implementare il fatto che se un utentemi clicca un div mentre l'altro o lo stesso mi stà facendo l'animazione deve farmi la cosa inversa?
mi spiego meglio:

-l'utente clicca un div
-a metà dell'"animazione" l'utente mi clicca un'altro div
-devo digli via programma che il div che stava andando a sinistra, ora deve andare a destra...

grazie

**andreaciao_22** · 11-07-2007, 08:41

up!

nessuno che mi sappia dare una mano?

**andreaciao_22** · 11-07-2007, 17:38

mi spiegate almeno perchè in internet explorer va in errore qui:

codice:

	var evt = evt || window.event;    
        
            var targetObj = evt.target||evt.srcElement;

questo metodo mi è stato suggerito da un utente del forum

grazie

**unbreakable9** · 12-07-2007, 04:14

Immagino volesse dire qualcosa del tipo:

var evento=(evt)?evt:window.event

Discussione: Consigli su script di animazione div

Strumenti discussione

Ricerca discussione

Visualizza

Consigli su script di animazione div

Permessi di invio