[vc_row][vc_column][vc_empty_space height= »50px »][vc_column_text]

[/vc_column_text][/vc_column][/vc_row][vc_row type= »color » bg_color= »#e8e8e8″ vertical_align= »yes » column_gap= »no » padding_top= » » margin_top= »0″ margin_bottom= »0″ min_height= »220″][vc_column width= »1/2″][vc_empty_space height= »30px »][vc_column_text css= ».vc_custom_1448963481742{margin-bottom: -10px !important;} »]

R?alisez un masque avec un bloc texte

[/vc_column_text][vc_column_text css= ».vc_custom_1448963736581{margin-right: 5% !important;} »]

Cette m?thode va permettre de r?aliser des fondus entre deux images ? l?aide du bloc texte.

[/vc_column_text][/vc_column][vc_column width= »1/2″][vc_empty_space height= »50px »][vc_column_text css= ».vc_custom_1448963914188{margin-left: 5% !important;} »]

[/vc_column_text][/vc_column][/vc_row][vc_row padding_top= » »][vc_column width= »5/6″][vc_single_image image= »123″ img_size= »full » alignment= »center »][vc_empty_space height= »10px »][vc_row_inner][vc_column_inner][vc_column_text]

[/vc_column_text][vc_separator color= »custom » accent_color= »#009cad »][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner][vc_video link= »https://vimeo.com/101617889″ css= ».vc_custom_1448895102752{margin-right: 5% !important;} »][/vc_column_inner][/vc_row_inner][vc_empty_space height= »90px »][vc_row_inner][vc_column_inner][vc_column_text]

[/vc_column_text][vc_separator color= »custom » accent_color= »#009cad »][vc_column_text]Tout d?abord, pr?parez?votre composition : uploadez?en amont tous les m?dias qui vous seront n?cessaires pour pouvoir r?aliser ce Racontr tips&tricks.

Une fois vos images import?es dans l??diteur, le tutoriel peut d?buter.

Imaginons que vous vouliez cr?er?un effet de calques de?l?image A sur l?image B, il vous faudra l?URL de celle-ci.

Pour cela, importez vos images sur la sc?ne, puis allez dans l?aper?u de page. Faites un clic droit sur l?image B et choisissez ??copier l?url de l?image??.[/vc_column_text][/vc_column_inner][/vc_row_inner][vc_single_image image= »820″ img_size= »full » onclick= »link_image » css= ».vc_custom_1447770236108{margin-right: 5% !important;} »][vc_row_inner][vc_column_inner width= »1/4″][vc_column_text]

1. Cr?ez un bloc texte, il est important qu?il soit plus large que votre image pour fonctionner de mani?re optimale.

[/vc_column_text][/vc_column_inner][vc_column_inner width= »1/4″][vc_column_text]

2. Dans les options du bloc texte, cliquez sur ? HTML ? et ajoutez le code ci-dessous en prenant soin d?y ajouter l?URL de l?image B.

[/vc_column_text][/vc_column_inner][vc_column_inner width= »1/4″][vc_column_text]

3. Il faut d?sormais jouer avec la timeline. Ici, allez ? deux secondes par exemple, et cr?ez un point cl? ? votre bloc texte.

Vous pouvez ?galement cliquer dans le champs largeur en bas pour cr?er une cl? d??chelle sur la timeline.[/vc_column_text][/vc_column_inner][vc_column_inner width= »1/4″][vc_column_text]

4. Retournez au point 0 et r?duisez la largeur du bloc texte qui masquait l?image A.
   Lancez l?aper?u, et voil?, vous avez r?alis? un fondu entre deux images !
   Vous pouvez r?p?ter cette m?thode pour la barre de chargement, vous n?aurez toutefois pas besoin de bloc texte car pr?server la forme n?a ici pas d?importance.

[/vc_column_text][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner][vc_column_text]Le code?:

<div style="

height:100%;

width:100%;

background-image: url(https://ce3861569bfb8e5b814c-7ceb94de4d3be92144118b01e53b4105.ssl.cf3.rackcdn.com/full_550ae3ea80ece-1426775960244.png);

background-position: top right;

background-repeat: no-repeat;">
<p>&nbsp;</p>
</div>[/vc_column_text][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width= »1/6″][vc_empty_space height= »50px »][vc_widget_sidebar sidebar_id= »sidebar-1″][/vc_column][/vc_row][vc_row padding_top= »0″ padding_bottom= »0″][vc_column][vc_empty_space][vc_single_image image= »132″ img_size= »full » alignment= »center »][/vc_column][/vc_row][vc_row type= »color » bg_color= »#e8e8e8″ vertical_align= »yes » column_gap= »no » padding_top= » » margin_top= »0″ margin_bottom= »0″ min_height= »220″][vc_column width= »1/3″][vc_empty_space][vc_column_text]

Plus de
tutoriels :

[/vc_column_text][/vc_column][vc_column width= »1/3″][vc_empty_space height= »65px »][vc_column_text]

• Propri?t?s du sc?nario
• Propri?t?s du projet

[/vc_column_text][/vc_column][vc_column width= »1/3″][vc_empty_space height= »65px »][vc_column_text]

• Propri?t?s de la timeline
• Charger ses m?dias

[/vc_column_text][/vc_column][/vc_row]