Problemi con clearInterval() => browser in ciclo infinito

**superpelo** · 23-11-2007, 19:38

Ciao a tutti,
ho un problema con clearInterval() che non riesco a risolvere.. cioè in realtà con capisco a cosa sia dovuto.

Nel codice sottostante setto degli intervalli con alcune funzioni lanciate dall'evento onmouseover. Con l'evento ounmouseout DOVREI cancellare gli intervalli.

Il problema però è che gli intervalli non si cancellano, le funzioni continuano la loro esecuzione all'infinito e il browser si impalla.

Qualche idea?

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="author" content="Sergi Meseguer, meddle" />
<title>scroll</title>

<style type="text/css">
	#scroll_container{
		position:relative;
		width:200px;
		height:200px;
		border:2px solid red;
		overflow:hidden;
	}

	#scroll_content{
		position:absolute;
		top:0px;
		left:0px;
		margin:0px;
		padding:0px;
		border:2px solid black;
	}
</style>

<script type="text/javascript">
	var timer = null;
	var delay = 10;
	var speed = 5;
	var currentX = 0;
	var currentY = 0;
	var containerWidth = 0;
	var containerHeight = 0;
	var contentWidth = 0;
	var contentHeight = 0;
	var offsetX = 0;
	var offsetY = 0;

	function initializeScroll(container,content) {
		containerWidth = container.clientWidth;
		containerHeight = container.clientHeight;
		contentWidth = content.clientWidth;
		contentHeight = content.clientHeight;
		offsetX = contentWidth-containerWidth;
		offsetY = contentHeight-containerHeight;
	}

  function moveUp(obj){
		targetObj = obj;
		if ( currentY >= 0 ) {
			clearTimer();
			return true;
		}
		currentY = currentY + speed;
		targetObj.style.top = currentY+'px';
		timer = setInterval('moveUp(targetObj)',delay);
	}

	function moveDown(obj){
		targetObj = obj;
		if ( offsetY < 0 ||  Math.abs(offsetY) < Math.abs(currentY) ) {
			clearTimer();
			return true;
		}
		currentY = currentY - speed;
		targetObj.style.top = currentY+'px';
		timer = setInterval('moveDown(targetObj)',delay);
	}

	function moveLeft(obj){
		targetObj = obj;
		if ( currentX >= 0 ) {
			clearTimer();
			return true;
		}
		currentX = currentX + speed;
		targetObj.style.left = currentX+'px';
		timer = setInterval('moveleft(targetObj)',delay);
	}

	function moveRight(obj){
		targetObj = obj;
		if ( offsetX < 0 ||  Math.abs(offsetX) < Math.abs(currentX) ) {
			clearTimer();
			return true;
		}
		currentX = currentX - speed;
		targetObj.style.left = currentX+'px';
		timer = setInterval('moveRight(targetObj)',delay);
	}

	function clearTimer(){
		if (timer)
			timer = clearInterval(timer);
	}

	window.onload = function() {
		initializeScroll(document.getElementById('scroll_container'),document.getElementById('scroll_content'));
	}
</script>

</head>

<body>

<div id="scroll_container">
	<div id="scroll_content">
		

riga</p>
		

riga</p>
		

rigaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
		

riga</p>
		

riga</p>
		

riga</p>
	</div>
</div>

Su
Giù
Sx
Dx

<div id="debug">x</div>

</body>
</html>

Grazie in anticipo!

**Xinod** · 23-11-2007, 20:54

ad un' occhiata veloce, ti basta sostituire tutti i setInterval con setTimeout (e ovviamente pulire con clearTimeout invece che clearInterval)
ciao

**whisher** · 23-11-2007, 22:31

Originariamente inviato da Xinod
ad un' occhiata veloce, ti basta sostituire tutti i setInterval con setTimeout (e ovviamente pulire con clearTimeout invece che clearInterval)
ciao

ad un'altra occhiata veloce
questo

Codice PHP:


timer = setInterval('moveRight(targetObj)',delay);

non si può fare

**superpelo** · 25-11-2007, 18:57

Ora funziona lla grande!

Grazie!

**br1** · 25-11-2007, 19:12

Per chi volesse riutilizzarlo: c'e' una maiuscola di meno alla riga

timer = setTimeout('moveLeft(targetObj)',delay);

ciao

Discussione: Problemi con clearInterval() => browser in ciclo infinito

Strumenti discussione

Ricerca discussione

Visualizza

Problemi con clearInterval() => browser in ciclo infinito

Permessi di invio