Mostrar los tags: imagen

Mostrando del 1 al 10 de 128 coincidencias
<<>>
Se ha buscado por el tag: imagen
Imágen de perfil

Mover una cortina por encima de una imagen


JavaScript

Publicado el 16 de Abril del 2021 por Info (99 códigos)
98 visualizaciones desde el 16 de Abril del 2021
Este código permite sobreponer parte de una imagen encima de la otra, y con el ratón mover parte de la imagen superior sobre la imagen inferior.

cortina-por-encima-imagen


Para este efecto se utilizan dos imágenes, la que esta encima y la que se encuentra debajo, y pulsando sobre la imagen o arrastrando el ratón, podemos descubrir mas o menos la imagen inferior.
El encargado de crear este efecto es el estilo clip-path https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path

Para el ejemplo, he utilizado una imagen a color, y la misma imagen en escala de grises para visualizar el efecto.
Imágen de perfil

Rotar diferentes grupos de imágenes a diferente velocidad en milisegundos


JavaScript

Publicado el 13 de Abril del 2021 por Joel (146 códigos)
357 visualizaciones desde el 13 de Abril del 2021
Función que permite rotar un grupo de imágenes a una velocidad especificada en milisegundos, y permite indicar si al finalizar la rotación vuelve a empezar desde el principio.

Para cada rotación de imágenes, la función tiene que recibir:
- los milisegundos que se mostrara cada imagen
- array con la ubicación de las imágenes
- id del elemento <img> donde mostrar las imagenes
- un valor boleano que determina si cuando finalicen las imagenes, empieza desde el inicio nuevamente (por defecto es true)

En este gif, se muestran varios grupos de imágenes que se mueven a diferente velocidades.
rotar-imagenes-cada-n-milisegundos
Imágen de perfil

Guardar y consultar una imagen de SQL Server


Visual Basic.NET

Publicado el 2 de Abril del 2021 por Administrador (708 códigos)
324 visualizaciones desde el 2 de Abril del 2021
Código que muestra como guardar imagenes dentro de la base de datos SQL Server y recuperarlos.

Imágen de perfil

Crear una imagen con un gráfico de barras con PHP


PHP

Publicado el 4 de Marzo del 2021 por Kata (74 códigos)
379 visualizaciones desde el 4 de Marzo del 2021
Código que genera una imagen gif con un gráfico de barras según información de nuestro array.

Puedes especificar los colores y tipo de letra.
Para que se muestren los textos, tiene que disponer del archivo true type de la fuente que vayas a utilizar en la carpeta donde se encuentra el php. Para este ejemplo, he utilizado arialbd.ttf.

grafica-de-barras-con-php-2

grafica-de-barras-con-php-1
Imágen de perfil

Crear una imagen con un gráfico de pastel con PHP


PHP

Publicado el 4 de Marzo del 2021 por Kata (74 códigos)
440 visualizaciones desde el 4 de Marzo del 2021
Código que genera una imagen png con un gráfico de pastel.

grafico-de-pastes-con-php
Imágen de perfil

Obtener todas las imágenes de nuestra pagina web


JavaScript

Publicado el 3 de Marzo del 2021 por Katas (176 códigos)
498 visualizaciones desde el 3 de Marzo del 2021
Función que devuelve todas las imágenes de nuestra pagina web.
Permite indicar si deseamos que hayan duplicados

1
2
3
getImages(document, true); // ['image1.jpg', 'image2.png', 'image1.png']
getImages(document, false); // ['image1.jpg', 'image2.png']
getImages(document.getElementById("article"), false); // ['article1.jpg', 'article2.png']
sin imagen de perfil

Trabajando con imagenes


PHP

Publicado el 19 de Febrero del 2021 por Jefferson (5 códigos)
432 visualizaciones desde el 19 de Febrero del 2021
Trabajar con imágenes, en estos días es lo que vende "ya que todo entra por la vista".

Pero si trabajamos solo con move_uploaded_file empiezan nuestro problemas ya que esta instrucción solo mueve un archivo del punto A-B usando el mecanismo HTTP POST.

Si la imagen que queremos es muy grande (sin mencionar la que tomamos de nuestro teléfono que son exageradamente grandes y ahora parecen no acabar de pixelarlas mas) Cuando queremos pintarlas en nuestro src comienza la peregrinación para que cargue.

Esto trae como consecuencia que los clientes visitantes de la pagina se obstinan y abandonan ...

Con esta clase en php "que no es mia, de hecho hay tantas versiones en internet y en tantos idiomas que es difícil saber su autoría"

Lo que hice fue tomar funciones de una y otra y las agrupe en una sola clase, para que al final tengamos todo en uno.

* - Con ella reducimos el tamaño (redimensionar)
* - Creamos img Thumb (muy pequeñas para los perfiles)
* - Eliminamos el fondo negro de los png
* - Enderezamos las imágenes que generalmente las voltean los tlf.

Espero les sea de ayuda, a mi me sirvió de mucho.

Aparte les dejare una pequeña guía de como manipularla.

La subo a Google Drive, por lo pesada de las imágenes https://drive.google.com/file/d/1DIECxgU21ws_zjWkSUa8RBi4QizFpg8o/view?usp=sharing




Sin-titulo
Imágen de perfil

Generador de videos de ruido.


Python

Actualizado el 17 de Diciembre del 2020 por Antonio (50 códigos) (Publicado el 12 de Diciembre del 2020)
801 visualizaciones desde el 12 de Diciembre del 2020
El presente código genera en la carpeta cuya ruta indicaremos, un video tipo glitch: Para ello, el programa nos pedirá el frame rate, dimensiones y duración en segundos del futuro vídeo, y los rangos de color (para los canales azul, verde y rojo) para definir el color de cada pixel. A partir de ahí se generará la creación del video en 2 fases: 1º la creación de los frames que compondrán el video (que luego podremos eliminar), y 2º la creación del vídeo a partir de dichos frames.

gm
gm2
gm3
gm4
gli
Imágen de perfil

Efecto de zoom en una imagen y texto con CSS3


CSS

estrellaestrellaestrellaestrellaestrella(32)
Actualizado el 8 de Diciembre del 2020 por Xavi (548 códigos) (Publicado el 18 de Enero del 2013)
128.988 visualizaciones desde el 18 de Enero del 2013
Código que muestra como generar un efecto de zoom sobre una imagen y texto al pasar el ratón por encima.


La misma versión permo haciendo zoom a los dos elementos a la vez: https://www.lawebdelprogramador.com/codigo/CSS/6759-Efecto-de-zoom-ha-varios-elementos-con-un-evento-hover-con-CSS3.html
Imágen de perfil

Efecto de zoom ha varios elementos con un evento hover con CSS3


CSS

Publicado el 8 de Diciembre del 2020 por Xavi (548 códigos)
1.909 visualizaciones desde el 8 de Diciembre del 2020
Este código es una modificación del código https://www.lawebdelprogramador.com/codigo/CSS/2275-Efecto-de-zoom-en-una-imagen-y-texto-con-CSS3.html#comentarios, permitiendo que al pasar el ratón por encima de un elemento, se active el hover de un texto y una imagen a la vez.