Evaluating bids

Efecto lupa en Wordpress Gutenberg

Published on the May 12, 2024 in IT & Programming

About this project

Open

Necesito crear un bloque de Wordpress (6.5.3 o superior, con Gutenberg) con la siguiente funcionalidad:
Lo que busco es crear un efecto de "lupa" (ver imagen adjunta ""efecto-lupa.png") sobre una imagen. La zona de lupa se moverá usando el ratón o el dedo en pantallas táctiles. También necesito que sobre la imagen aparezca uno o varios textos personalizados que parezcan estar integrados en la imagen y quiero que la lupa también los amplíe, como si pertenecieran a la imagen. Que todo sea responsive.
Por tanto, necesito poder:
1. Cambiar las dos imágenes.
2. Cambiar la "capa" de textos (para cada texto): activado o no, y color, fuente, tamaño, posición, justificación y perspectiva 3D.
3. Cambiar el tamaño del círculo, o que sea un rectángular (y poder establecer su alto y ancho).
4. Cambiar (o deshabilitar) el grosor y color del trazo alrededor de la zona de la lupa.
5. Añadir una imagen PNG (con transparencias) alrededor de la zona de la lupa (para poner por ejemplo una lupa "real", ver imagen adjunta). Habrá que poder elegir sus coordenadas X,Y para recolocar la imagen y que el agujero de la lupa coincida con la zona de la lupa. Aquello que sobresalga de esta imagen fuera de la imagen A en principio no es necesario que se muestre.
6. Cambiar los valores X e Y del lugar de aparición de la lupa respecto al cursor. Estoy pensando en el uso con el dedo en pantallas táctiles, donde el dedo taparía la lupa.


Este efecto lo usaré varias veces con distintos contenidos. El código sería de mi propiedad.

Quiero hacer otros tipos de efectos e incluso minijuegos  (¿tal vez con Godot?) así que este sería un primer trabajo de varios, por eso pongo el precio más bajo pero lo podemos hablar.

Un saludo y gracias por interesarte!

Project overview

La página será para impulsar mis trabajos artísticos personales (relatos, ilustraciones, etc).

Category IT & Programming
Subcategory Wordpress
What is the scope of the project? Custom development
Is this a project or a position? Project
I currently have I have specifications
Required availability As needed

Delivery term: Not specified

Skills needed

Other projects posted by J.