Problema con ejecución de javascript en mozilla

edwintinieblas · #1 (**permalink**) 09/12/2012, 04:19

Hola buenas noches, de antemano gracias a quien me pueda ayudar en mi problema :P

Estoy haciendo una pagina con javascript donde se deberán mover diferentes div's al mismo tiempo cuando los arrastres con el cursor, hasta ahorita todo va bien, o bueno casi bien :(

Mi problema en sí es que no me quiere correr en mozilla, ya lo probé en IE, Chrome y Safari, el único que no me resulta es Mozilla, no se por que, pongo el código a ver si alguien me puede ayudar :D

Como dije, gracias de antemano.

Código HTML:

<html>

<head>

<style type="text/css">

	.objMovible { position:absolute; cursor:pointer }

</style>

<script type="text/javascript">

	var estoyArrastrando = false;
	var obj;
	var obj1;
	var a_des;
	var p_des;
	var pos_obj;
	var pos_obj_1;

	function presionarBoton() {

		estoyArrastrando = true;
		obj = document.getElementById('div_');
		obj1 = document.getElementById('div_1');
		a_des = event.clientX;
		pos_obj = parseInt(obj.style.left);
		pos_obj_1 = parseInt(obj1.style.left);
		return false;

	}

	document.onmousedown = presionarBoton;

	function arrastrarRaton(){

		if (estoyArrastrando) {

			p_des = event.clientX;

			if (((pos_obj>0)&&(pos_obj_1>0))||((pos_obj<0)&&(pos_obj_1<0))) { 

				obj.style.left = (p_des - a_des) + pos_obj;
				obj1.style.left = (p_des - a_des) + pos_obj_1;

			} else {

				obj.style.left = (p_des - a_des);
				obj1.style.left = (p_des - a_des);

			}

			return false;

		}

	}

	document.onmousemove = arrastrarRaton;

	function soltarBoton() {	

		estoyArrastrando = false;

	}

	document.onmouseup = soltarBoton;

</script>

</head>

<body>

<div  id="div_" class="objMovible" style="top:200px;width:200px;height:20px;background-color:#CC0000"></div>
<div  id="div_1" class="objMovible" style="width:200px;height:20px;background-color:#CC0000"></div>

</body>
</html>

emprear · #2 (**permalink**) 09/12/2012, 05:36

Firefox necesita que le pases el objeto event como un argumento, líneas 26 y 40, y luego tufuncion(e)

Código HTML:

Ver original<html>
 
<head>
 
<style type="text/css">
 
    .objMovible { position:absolute; cursor:pointer }
 
</style>
 
<script type="text/javascript">
 
    var estoyArrastrando = false;
    var obj;
    var obj1;
    var a_des;
    var p_des;
    var pos_obj;
    var pos_obj_1;
 
    function presionarBoton(e) {
 
        estoyArrastrando = true;
        obj = document.getElementById('div_');
        obj1 = document.getElementById('div_1');
        e = window.event || e; 
        
        a_des = e.clientX;
        pos_obj = parseInt(obj.style.left);
        pos_obj_1 = parseInt(obj1.style.left);
        return false;
 
    }
 
    document.onmousedown = presionarBoton;
 
    function arrastrarRaton(e){
 
        if (estoyArrastrando) {
e = window.event || e; 
            p_des = e.clientX;
 
            if (((pos_obj>0)&&(pos_obj_1>0))||((pos_obj<0)&&(pos_obj_1<0))) { 
 
                obj.style.left = (p_des - a_des) + pos_obj;
                obj1.style.left = (p_des - a_des) + pos_obj_1;
 
            } else {
 
                obj.style.left = (p_des - a_des);
                obj1.style.left = (p_des - a_des);
 
            }
 
            return false;
 
        }
 
    }
 
    document.onmousemove = arrastrarRaton;
 
    function soltarBoton() {    
 
        estoyArrastrando = false;
 
    }
 
    document.onmouseup = soltarBoton;
 
</script>
 
</head>
 
<body>
 
<div  id="div_" class="objMovible" style="top:200px;width:200px;height:20px;background-color:#CC0000"></div>
<div  id="div_1" class="objMovible" style="width:200px;height:20px;background-color:#CC0000"></div>
 
</body>
</html>

Saludos

edwintinieblas · #3 (**permalink**) 09/12/2012, 17:17

Grax men, me fuiste de gran ayuda, cada día aprendemos algo nuevo, me da gusto ver lo que puede llegar a hacer una comunidad.

Me sirvió perfectamente tu rectificación :D