Manipular imagen

Berletzis · #1 (**permalink**) 05/01/2004, 14:04

que onda chavos otra vez yo:

Tengo una consulta en ASP ok la cual despliega un aimagen. Ok

elproblema que tengo es que la tengo que desplegar dentro de una tabla y si laimagem llega a ser mas grande uela tabla puesme modifica toda la tabla. como pedo hacer para manipular el tamaño de la imagen para que se despliegue segun el tamaño de la tabla CLARO ESTA QUE SIN MODIFICAR LA CALIDAD DE LA IMAGEN.

Talvez reducirla a cierto porcentaje o no se...
Como puedo hacer esto??????

Gracias.........
bye
y ya saben lo de mi server haber que proponen que podemos hacer?????!!!!!!!!!!!!! bye

tunait · #2 (**permalink**) 05/01/2004, 14:20

Hace no mucho dejé éste en donde preguntaron lo mismo, tal vez te sirva

Código:

<script language="javascript"> 
/************************************************** Redimensionar imágenes. Script creado por Tunait! (31/7/2003) 
Si quieres usar este script en tu sitio eres libre de hacerlo con la 
condición de que permanezcan intactas estas líneas, osea, los créditos. 
No autorizo a publicar y ofrecer el código en sitios de script sin 
previa autorización 
Si quieres publicarlo, por favor, contacta conmigo. 
http://javascript.tunait.com/ 
[email protected]  
******************************************* ******/ 
var maxAncho = 300 //define la anchura máxima de la imagen 
var maxAlto = 250 //define la altura máxima de la imagen 
function fotilla(ancho,alto,cual) 
{ 
if (ancho > alto) {forma = 'apaisada'} 
if (ancho < alto) {forma = 'retrato'} 
if(forma == 'apaisada') 
 { 
 if(ancho > maxAncho) 
  { 
  porcientoAnchura = parseInt(maxAncho/ancho*100) 
  cual.width = maxAncho 
  cual.height = porcientoAnchura*alto/100 
  } 
 } 
else if (forma == 'retrato') 
 { 
 if (alto > maxAlto) 
  { 
  porcientoAltura = maxAlto/alto*100 
  cual.height = maxAlto 
  cual.width = porcientoAltura*ancho/100 
  } 
 } 
} 
</script>

Y a la imagen que se carga ponle lo siguiente:

onload="fotilla(this.width,this.height,this)"

en maxAncho y en maxAlto debes definir el tamaño máximo al que quieras que se muestren tus imágenes.

tunait · #3 (**permalink**) 05/01/2004, 14:23

Hace no mucho dejé éste en donde preguntaron lo mismo, tal vez te sirva

Código:

<script language="javascript"> 
/*************************************************** 
Redimensionar imágenes. Script creado por Tunait! (31/7/2003) 
Si quieres usar este script en tu sitio eres libre de hacerlo con la condición de que permanezcan intactas estas líneas, osea, los créditos. 
No autorizo a publicar y ofrecer el código en sitios de script sin previa autorización 
Si quieres publicarlo, por favor, contacta conmigo. 
http://javascript.tunait.com/ 
[email protected]  
************************************************************************ ******/ 
var maxAncho = 300 //define la anchura máxima de la imagen 
var maxAlto = 250 //define la altura máxima de la imagen 
function fotilla(ancho,alto,cual) 
{ 
if (ancho > alto) {forma = 'apaisada'} 
if (ancho < alto) {forma = 'retrato'} 
if(forma == 'apaisada') 
 { 
 if(ancho > maxAncho) 
  { 
  porcientoAnchura = parseInt(maxAncho/ancho*100) 
  cual.width = maxAncho 
  cual.height = porcientoAnchura*alto/100 
  } 
 } 
else if (forma == 'retrato') 
 { 
 if (alto > maxAlto) 
  { 
  porcientoAltura = maxAlto/alto*100 
  cual.height = maxAlto 
  cual.width = porcientoAltura*ancho/100 
  } 
 } 
} 
</script>

Y a la imagen que se carga ponle lo siguiente:

onload="fotilla(this.width,this.height,this)"

en maxAncho y en maxAlto debes definir el tamaño máximo al que quieras que se muestren tus imágenes.

JavierB · #4 (**permalink**) 05/01/2004, 14:33

tunait ha repetido un mensaje. tunait ha repetido un mensaje.

Que alguien avise a la moderadora del Foro.

tunait · #5 (**permalink**) 05/01/2004, 14:37

chivato acusicaaaaa

Berletzis · #6 (**permalink**) 05/01/2004, 15:57

Oye es correcto esto, porque de ser asi me marca un error de cuantificador inesperado

<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Pagina nueva 1</title>
<script language="javascript">
/ **************************************************
*
Redimensionar imágenes. Script creado por Tunait! (31/7/2003)
Si quieres usar este script en tu sitio eres libre de hacerlo con la condición de que permanezcan intactas estas líneas, osea, los créditos.
No autorizo a publicar y ofrecer el código en sitios de script sin previa autorización
Si quieres publicarlo, por favor, contacta conmigo.
http://javascript.tunait.com/
[email protected]
**************************************************
********************** ******/
var maxAncho = 300 //define la anchura máxima de la imagen
var maxAlto = 250 //define la altura máxima de la imagen
function fotilla(ancho,alto,cual)
{
if (ancho > alto) {forma = 'apaisada'}
if (ancho < alto) {forma = 'retrato'}
if(forma == 'apaisada')
{
if(ancho > maxAncho)
{
porcientoAnchura = parseInt(maxAncho/ancho*100)
cual.width = maxAncho
cual.height = porcientoAnchura*alto/100
}
}
else if (forma == 'retrato')
{
if (alto > maxAlto)
{
porcientoAltura = maxAlto/alto*100
cual.height = maxAlto
cual.width = porcientoAltura*ancho/100
}
}
}
</script>

</head>

<body>

<img onload="fotilla(this.width,this.height,this)" border="0" src="file:///F:/imagen.JPG" width="702" height="463"></
<p> </p>
<p>
p>
</body>

</html>

tunait · #7 (**permalink**) 05/01/2004, 16:08

Uf, de los dos mensajes repes que me salieron, el bueno es el primero.

Has copiado el segundo (ley de murphy, ahora lo borro) y te quedan asteriscos sueltos. Ese es el error que te da.

quita el asterisco suelto

*

y la última fila de asteriscos sueltos

***********

Curioso que lo que dé el error sean los créditos

jé...

maxi_lance · #8 (**permalink**) 05/04/2010, 19:49

tiene unos años el post pero espero puedan darmen una mano...
la funcion "fotilla(this.width,this.height,this)" funciona ok, pero al momento de cargar la pagina muestra las imagenes en tamaño real antes de acomodarse con el tamaño que le especifico en dicha funcion.
Al mostrarme las imagenes grandes rompe todo el diseño mientras se carga la web completa.

Hay alguna forma de que no aparezcan en tamaño original ?

El codigo:

Código HTML:

<script language="javascript"> 

var maxAncho = 154 
var maxAlto = 115 
function fotilla(ancho,alto,cual) 
{ 
if (ancho > alto) {forma = 'apaisada'} 
if (ancho < alto) {forma = 'retrato'} 
if(forma == 'apaisada') 
 { 
 if(ancho > maxAncho) 
  { 
  porcientoAnchura = parseInt(maxAncho/ancho*100) 
  cual.width = maxAncho 
  cual.height = porcientoAnchura*alto/100 
  } 
 } 
else if (forma == 'retrato') 
 { 
 if (alto > maxAlto) 
  { 
  porcientoAltura = maxAlto/alto*100 
  cual.height = maxAlto 
  cual.width = porcientoAltura*ancho/100 
  } 
 } 
} 
</script>

La llamo desde aca:

Código PHP:

  <div id="clipwrapper">

        <div id=clip>

            <img src="admin/img/'.MostrarImagen($row["idProducto"]).'" onload="fotilla(this.width,this.height,this)"  border="0">            

         </div>

      </div>

Donde los div clipwrapper y clip son recuadros para que corte la imagen.

Código HTML:

#clipwrapper{
  position:relative;
  height:115px;
  width:154px;
  border: #dbdbdc 1px solid;
  text-align:center;
}
.clip{
  position:absolute;
  clip:rect(2px 152px 113px 2px);
}

Gracias ....

caricatos · #9 (**permalink**) 06/04/2010, 00:20

Hola:

El elemento tiene un id y no tiene ningún atributo class, y en ccs cuando algo empieza por un punto es para definir una clase.

Por cierto, el tema queda cerrado por antiguo

Siempre puede referenciarse.

Saludos