Problemas con firefox

FramA · #1 (**permalink**) 22/10/2007, 10:12

Hola, estoy intentando hacer una especie de visualizador con zoom en javascript. Bien caso es el siguiente. Tengo un div de un tamaño determinado que es donde se encuentra la imagen que vamos a ver. Tengo una serie de botones que aumentan y reducen la imagen. Lo que quiero es que cuando la imagen sea mas grande que el div que la contiene, la parte que esté fuera del div se oculte. Por ahora todo bien, el caso es que le he añadido un codigo para que con el raton podamos arrastrar la imagen dentro del div para ver la parte que queramos y para eso tengo que ponerle la propiedad 'position:absolute' a la imagen. Cuando hago esto, en firefox la imagen se muestra por completo y no se oculta la parte que esta fuera del rango del div. Por el contrario en IE funciona bien. ¿Como lo puedo hacer?

Gracias

JavierB · #2 (**permalink**) 22/10/2007, 10:18

Hola FramA

Pon el código que estás usando, así no tendremos que opinar "a ciegas"

Saludos,

FramA · #3 (**permalink**) 22/10/2007, 10:38

Es verdad, lo siento:

Código:

<html>
  <head>
      <script type="text/javascript" src="js/jquery-1.2.1.js"></script>
	  <script type="text/javascript" src="js/jquery.rotate.js"></script>
	  <script type="text/javascript" src="js/jquery.dimensions.js"></script>
	  <script type="text/javascript" src="js/movimiento.js"></script>
	  <script type="text/javascript" src="js/viewer.js"></script>
  </head>
  <body>
<table>
	<tr>
		<td>

  <a onclick="javascript:girarDerecha('imagen')">Girar Derecha</a>
  <a onclick="javascript:girarIzquierda('imagen')">Girar Izquierda</a>
  <a onclick="javascript:posInicial('divMovimiento')">Esquina</a>
  <a onclick="javascript:zoomMas('imagen','divVentanaViewer')">ZOOM +</a>
  <a onclick="javascript:zoomMenos('imagen','divVentanaViewer')">ZOOM -</a>

   <a onclick="javascript:ajustar('imagen','divVentanaViewer');posInicial('divMovimiento');">ajustar</a></td>

	</tr>
	<tr>
	
	<td>
	
	<div id="divVentanaViewer" style=" width: 490px; height: 450px; overflow: auto; overflow:hidden;" >
		<div id="divMovimiento" style="top:1px; left:1px; position:absolute; float:left; " 
                                        onmousedown="comienzoMovimiento(event, this.id);" onmouseover="this.style.cursor='move'">
		    <span>
			<IMG src="image.jpg" align="left" border="0" id="imagen" alt="foto"> 
		    </span>
		</div>
                 </div>
</td>
</tr></table>

</body>
</html>