Autor Tema: ¿Como "ocultar"las imagenes?.  (Leído 787 veces)

Desconectado Siquillote

  • PHPero Master
  • ******
  • Mensajes: 4.229
  • Karma: 179
  • Sexo: Masculino
    • Ver Perfil
¿Como "ocultar"las imagenes?.
« en: 03 de Noviembre de 2011, 20:09:00 pm »

Hola PHPerillos! :).

Estaba en Tuenti y la verdad es que hay algo que me ha llamado la atención. Si nos fijamos en las fotos etiquetadas o en las subidas, las imagenes salen "recortadas". Es decir, en la preview salen recortadas pero luego al verlas sale en su tamaño original. Aquí dejo un ejemplo:

recortada.png


grande.png


#Fdo. Physlet

Comunidad PHPeros

¿Como "ocultar"las imagenes?.
« en: 03 de Noviembre de 2011, 20:09:00 pm »

Desconectado Mixvice

  • PHPero Experto
  • *****
  • Mensajes: 687
  • Karma: 32
  • Sexo: Masculino
  • ¡Y Tu Papá Tambien!
    • Ver Perfil
    • Tuhabbo
Re:¿Como "ocultar"las imagenes?.
« Respuesta #1 en: 03 de Noviembre de 2011, 20:38:14 pm »
Se llama thumbnail, generalmente se hace con php (libreria GD) xD lo que hace es modificar el tamaño de una imagen sin alterar la original..

PD. Cristiano ronaldo?  :confused: jaja

Desconectado Siquillote

  • PHPero Master
  • ******
  • Mensajes: 4.229
  • Karma: 179
  • Sexo: Masculino
    • Ver Perfil
Re:¿Como "ocultar"las imagenes?.
« Respuesta #2 en: 03 de Noviembre de 2011, 20:41:06 pm »

Se llama thumbnail, generalmente se hace con php (libreria GD) xD lo que hace es modificar el tamaño de una imagen sin alterar la original..

PD. Cristiano ronaldo?  :confused: jaja

¿Hay alguna manera de hacerlo con jQuery o JS?. Y si, he cogido una foto cualquiera, la del mejor jugador del mundo.

#Fdo. Physlet

Desconectado Mixvice

  • PHPero Experto
  • *****
  • Mensajes: 687
  • Karma: 32
  • Sexo: Masculino
  • ¡Y Tu Papá Tambien!
    • Ver Perfil
    • Tuhabbo
Re:¿Como "ocultar"las imagenes?.
« Respuesta #3 en: 03 de Noviembre de 2011, 20:44:58 pm »
Pues en la pagina de jquery hay algo de esto pero no le puse mucha importancia pues no lo necesito aún. Igual puedes ver como funciona y si te sirve me cuentas xD

Desconectado CarlosRdrz

  • Moderador Global
  • PHPero Master
  • *****
  • Mensajes: 2.505
  • Karma: 131
  • Sexo: Masculino
  • A.k.a. TLX
    • Ver Perfil
Re:¿Como "ocultar"las imagenes?.
« Respuesta #4 en: 03 de Noviembre de 2011, 20:53:14 pm »
Hola!

No sé como se hace exactamente, así que en este mensaje solo voy a suponer o especular como podría estar hecho.

En primer lugar, dudo que hacerlo en PHP sea la mejor opción, en primer lugar porque consumes muchísimos recursos del servidor, y porque vas a tener que guardar dos imagenes (el thumbnail y la imagen original).

Si lo piensas, podría hacerse facilmente con un div y esa imagen de fondo, desplazada. Algo parecido a como se hacen los sprites para las webs.
Solo quedaría el tema de redimensionarlo, que leyendo en google y buscando por redimensiones en CSS puedes encontrar algo como esto:
http://www.cssblog.es/metodos-redimensionar-imagenes-css/

Un saludo!
La dedicación de mi respuesta sera directamente proporcional a la dedicación de tu pregunta.
Hacer códigos que entiendan las máquinas es fácil, lo difícil y realmente útil es hacer códigos que entiendan las personas.
http://twitter.com/CarlosRdrz
http://www.carlosrdrz.es

Desconectado Siquillote

  • PHPero Master
  • ******
  • Mensajes: 4.229
  • Karma: 179
  • Sexo: Masculino
    • Ver Perfil
Re:¿Como "ocultar" las imagenes?.
« Respuesta #5 en: 03 de Noviembre de 2011, 21:13:35 pm »

Hola!

No sé como se hace exactamente, así que en este mensaje solo voy a suponer o especular como podría estar hecho.

En primer lugar, dudo que hacerlo en PHP sea la mejor opción, en primer lugar porque consumes muchísimos recursos del servidor, y porque vas a tener que guardar dos imagenes (el thumbnail y la imagen original).

Si lo piensas, podría hacerse facilmente con un div y esa imagen de fondo, desplazada. Algo parecido a como se hacen los sprites para las webs.
Solo quedaría el tema de redimensionarlo, que leyendo en google y buscando por redimensiones en CSS puedes encontrar algo como esto:
http://www.cssblog.es/metodos-redimensionar-imagenes-css/

Un saludo!

¡+1! No tenía ni mas pajorela idea de que se pudiese hacer en CSS. Increíble lo que puede hacer CSS, me estoy quedando flipando con lo que he visto a lo largo de esta semana, cada día vuelvo a sentir esas ganas de aprender de cuando empecé ;-)

Se llama thumbnail, generalmente se hace con php (libreria GD) xD lo que hace es modificar el tamaño de una imagen sin alterar la original..

PD. Cristiano ronaldo?  :confused: jaja

Tu también te llevas otro +1. No es justo lo que yo buscaba (Lo que yo busco es lo que nos dice carlosRdrz) pero por tu ayuda te lo llevas igualmente.

Un saludo,
Siquillote.

#Fdo. Physlet

Desconectado Mixvice

  • PHPero Experto
  • *****
  • Mensajes: 687
  • Karma: 32
  • Sexo: Masculino
  • ¡Y Tu Papá Tambien!
    • Ver Perfil
    • Tuhabbo
Re:¿Como "ocultar"las imagenes?.
« Respuesta #6 en: 03 de Noviembre de 2011, 21:15:12 pm »
Hola!

No sé como se hace exactamente, así que en este mensaje solo voy a suponer o especular como podría estar hecho.

En primer lugar, dudo que hacerlo en PHP sea la mejor opción, en primer lugar porque consumes muchísimos recursos del servidor, y porque vas a tener que guardar dos imagenes (el thumbnail y la imagen original).

Si lo piensas, podría hacerse facilmente con un div y esa imagen de fondo, desplazada. Algo parecido a como se hacen los sprites para las webs.
Solo quedaría el tema de redimensionarlo, que leyendo en google y buscando por redimensiones en CSS puedes encontrar algo como esto:
http://www.cssblog.es/metodos-redimensionar-imagenes-css/

Un saludo!

Lo malo de esto es que si tienes 3 imagenes que pesan 1mb y lo haces con css de misma forma estarias cargando 3mb... Igual esto depende del usuario pero si es una galeria por ejemplo, sería mas util usar php para hacer las thumbnail o bien editar tu mismo las imagenes xD

Desconectado CarlosRdrz

  • Moderador Global
  • PHPero Master
  • *****
  • Mensajes: 2.505
  • Karma: 131
  • Sexo: Masculino
  • A.k.a. TLX
    • Ver Perfil
Re:¿Como "ocultar"las imagenes?.
« Respuesta #7 en: 05 de Noviembre de 2011, 19:59:34 pm »
Lo malo de esto es que si tienes 3 imagenes que pesan 1mb y lo haces con css de misma forma estarias cargando 3mb... Igual esto depende del usuario pero si es una galeria por ejemplo, sería mas util usar php para hacer las thumbnail o bien editar tu mismo las imagenes xD

Como todo, depende de que te interese para hacer la galería, pero en ningún caso usar PHP con GD sale bien parado (bajo mi punto de vista).

Hay tres opciones:
1. Cada vez que MUESTRES el thumbnail, crearlo desde la imagen original con GD, con lo que estás gastando procesamiento del servidor tontamente.
Ventajas: no gastas espacio en el servidor
Desventajas: Gastas procesamiento del servidor

2. Cada vez que SUBAS una imagen, crear su thumbnail con GD y guardarlo junto a la imagen original.
Ventajas: gastas bastante menos procesamiento del servidor
Desventajas: gastas espacio en el servidor

3. Cada vez que muestres una imagen, generar el thumbnail con CSS y mostrarlo
Ventajas: no gastas espacio en el servidor y el servidor no gasta procesamiento en generar el thumbnail (lo hace el cliente).
Mas ventajas: como el cliente tiene que descargar la imagen completa para generar el thumbnail, a la hora de mostrar la imagen completa no tendrá que esperar porque la tiene cacheada
Desventajas: Tiene que descargar la imagen completa (¿Es realmente una desventaja?). ¿Estándares?

Un saludo
La dedicación de mi respuesta sera directamente proporcional a la dedicación de tu pregunta.
Hacer códigos que entiendan las máquinas es fácil, lo difícil y realmente útil es hacer códigos que entiendan las personas.
http://twitter.com/CarlosRdrz
http://www.carlosrdrz.es

Desconectado SoyJoaquin.

  • PHPero Master
  • ******
  • Mensajes: 2.737
  • Karma: 131
  • Sexo: Masculino
  • ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ Problem?
    • Ver Perfil
    • IsoMap
Re:¿Como "ocultar"las imagenes?.
« Respuesta #8 en: 06 de Noviembre de 2011, 03:32:14 am »
En mi punto de vista, seria mejor usar CSS para ponerlo de fondo en un div para que se "recorte", creo que es mejor.
Como dice carlos, el problema viene del lado del cliente, no del servidor y a mi parecer es mejor dejarle los problemas al cliente (tampoco en todo pero si en estos casos)

Saludos!
Twitter: @JoakoM010