Communauté

qc2m

Membre

Inscription : 09-03-2019

"masque d'invisibilité" ✓

Bonjour,

J'ai besoin d'une idée pour avancer sur mon problème.
J'ai une image de fond dans mon lieu (voir capture).
Je veux faire traverser un avion de gauche à droite sur toute la largeur. Mais je veux que l'avion passe derrière les montagnes (comme sur l'image) Un peu comme si il y avait un "masque d'invisibilité" au niveau des montagnes.
A votre avis, est-ce faisable en css ou autre ? J'ai fait quelques essais mais rien de concluant.

Merci d'avance pour vos idées.

Catmaya

Membre

Inscription : 14-04-2020

Re : "masque d'invisibilité" ✓

Bonjour qc2m,

Sans faire passer un avion derrière, j'ai déjà caché des objets derrière un élément du décor. Pour cela, j'ai placé mon image dans un logiciel de retouche et j'ai découpé la partie qui m'intéressait, que j'ai sauvegardée en .png dans la même résolution. Ensuite il faut la jouer fin en mettant ce détail de l'image dans un objet et en le positionnant au pixel près, mais c'est possible.

Après c'est une question de z-index. Je pense que c'est jouable avec l'avion qui se déplace, il faudra bien détourer pour qu'il n'y ait plus de ciel dans l'objet.

Dernière modification par Catmaya (20-09-2020 09:24:59)

qc2m

Membre

Inscription : 09-03-2019

Re : "masque d'invisibilité" ✓

Je cherchais avec des css mais cette solution est très bien aussi. Un peu plus longue parce qu'il faut détourer mais ça fonctionne très bien.

J'ai mis mon fond d'écran, un élément de décor reprenant mon fond d'écran avec le ciel transparent et la valeur "plan"=5 et mon avion qui passe avec la valeur "plan"=2. Ca fonctionne parfaitement.

Merci beaucoup.

Catmaya

Membre

Inscription : 14-04-2020

Re : "masque d'invisibilité" ✓

Super, je suis contente que ça ait marché !

jawa

Admin

Re : "masque d'invisibilité" ✓

Bonjour,
Oui c'est la bonne méthode, séparer les objets (bien détourés) et les positionner avec des valeurs de plans.
A noter qu'il est aussi possible de mettre un décor en png transparent (montagnes sans ciel), un décor d'arrière plan qui sera tout au fond (ciel) et ensuite d'intercaler des objets d'arrière plan plus au moins profonds entre les 2 (plan situé entre -100 et -200). Sur un panoramique cela générera un effet parallaxe sur les arrières plans.

Z

La Newsletter

Membre

Inscription : 21-08-2020

Re : "masque d'invisibilité" ✓

Bonsoir,

Il me semble que la question de qc2m (pitié, dites-nous au moins votre prénom, ce serait plus sympa à écrire :) ) et les différentes réponses illustrent pile-poile ce qu’est un [i]gamescript[/i] et la richesse des possibilités. Selon les logiciels sous la main, selon l’habileté en dessin, selon les compétences en CSS, selon la vision personnelle de la scène… on trouve une solution.