Bonsoir, je cherche désespérément une solution en css pour créer un masque de fusion en css/jquery.
Si vous avez une piste, je suis preneur :)

3 réponses


salut, peux tu préciser ?

ze0ne
Auteur

Salut, en fait je cherche une astuce, pour créer une couche alpha qui me permettrai de faire office de masque de fusion.
Actuellement, je procède ainsi:

J'ai un div "englobant".
A l'intérieur, deux div, une première qui affiche le contenu et une seconde qui me sert de masque.
Concernant le premier, rien de particulier. Le second lui possède un z-index supérieur au premier et je le position au dessus du premier via css. Jusque la pas de problème, le deuxième div passe bien au dessus du premier.
Afin d'avoir un effet de "masque", le deuxième div (celui au premier plan) est constitué uniquement d'un background-image avec un png. L'image est composée de dégradés de blanc et le rendu est satisfaisant, on a bien l'impression qu'il y a un masque de fusion sur l'image.

Le soucis, c'est que mon subterfuge ne fonctionne que sur un fond unis. Par conséquent, je cherche une solution plus universelle pour gérer ce masque via un système de couche alpha ou autre.