Ver Mensaje Individual
  #10 (permalink)  
Antiguo 03/07/2007, 07:43
kepawe
 
Fecha de Ingreso: agosto-2004
Mensajes: 157
Antigüedad: 20 años, 6 meses
Puntos: 5
Re: cambiar el backgroundPosition en IE va lento

Hola derkenuke y MaBoRaK.

También tienes que controlar el burbujeo que se produce con el evento mouseover:

Código:
<div id="coord" style="font-size: 12px; color: red; float: right;"></div>
<div id="info" style="font-size: 12px; color: red; float: right;"></div>



<script type="text/javascript">

function e(q,br) {
	document.body.appendChild( document.createTextNode(q) );
	if(br!==0) document.body.appendChild( document.createElement("BR") );
}

function id(x) { return document.getElementById(x); }


var c=id("capa");
var altura = c.offsetHeight;
var anchura = c.offsetWidth;
var info=id("info");

window.onload = function() {
	ponElBackground(-200,-200,300,0,"555555","ffffff");
}

var ctrl = 0;
var fmouseover = function(ev) {
	var current, related;
	if (window.event) {
		current = this;
		related = window.event.fromElement;
	}
	else {
		current = ev.currentTarget;
		related = ev.relatedTarget;
	}
	
	
	if (current != related && !contains(current, related)) {
	info.innerHTML += "- onmouseover!, entro en "+ (ev ? ev.target.id	: window.event.srcElement.id) +"<br/>"; 
		ctrl++;
		c.onmousemove = function(ev) {
			var y = this.offsetTop;
			var x = this.offsetLeft;
			var X = ev ? ev.clientX : event.clientX ;
			var Y = ev ? ev.clientY : event.clientY ;
			x = X-x, y=Y-y;
			document.getElementById("coord").innerHTML = "coord:" + x+", "+y  + " ctrl = " + ctrl;

			mueveBackground(x,y,300);
		}
	}
}

c.onmouseover = fmouseover;

c.onmouseout = function(ev) {
	var current, related;
	if (window.event) {
		current = this;
		related = window.event.toElement;
	}
	else {
		current = ev.currentTarget;
		related = ev.relatedTarget;
	}
	
	if(current && related ){		// related puede dar undefined cuando se sale de la capa a otra ventana del sistema operativo
		if (current != related && !contains(current, related)) {
			info.innerHTML += "- onmouseout!, estaba en "+current.id+", pero he salido a "+related.id+" <br/>";
			// ni el current es igual al related (no he salido y entrado del mismo elemento) ni lo contiene, luego he salido del current, luego el evento onmouseout ha de saltar y mover el fondo a -1000,-1000
			// muevo el fondo a -1000,-1000
			mueveBackground(-1000,-1000,0);
			//activo el onmouseover
			info.innerHTML += "- activo el evento mouseover!<br/>";
			current.onmouseover = fmouseover;
		}

	}
}


Salu2