Image1.0<div><a><span></span><span></span></a></div>

</bloc><images_selector default='[]' facultative='true' help='Cette propriété vous permet de préciser la ou les photos qui seront affichées en plein-écran. Si vous ne sélectionnez aucune photo et que vous avez cochez la case 'Plein écran au clic', l'image du module Image sera affichée en plein écran.' icon='screen' name='tb_imgs' value='Images en plein-écran' /><link_selector default='null' help='Insère un lien vers un site externe, un document ou une page, ou supprime le lien actuel.' icon='t_link' name='link' /><textarea facultative='true' feature='image_menu_mouseover' height='20' help='Entrez ici le nom d'un menu déroulant qui sera affiché au survol de l'image.<br>Le nom du menu déroulant doit aussi être spécifié dans les propriétés du menu que vous voulez afficher.' icon='menu' name='mouseoverMenu' text='Menu au survol' /></properties><design_properties><trigger help='Adapte la taille du module à la taille réelle de l'image.' icon='arrow_tb' text='Taille réelle' trigger='realsize' /><bloc><radio class='filterRadio' default=''none'' display='Aucun|Noir et Blanc|Flou|Inverser|Contraste|Couleur ou dégradé' help='Sélectionne le filtre pour l'image.<br> <b>Aucun</b> pas de filtre<br> <b>Noir et blanc</b> supprime toutes les couleurs<br> <b>Flou</b> rend l'image floue<br> <b>Inverse</b> inverse toutes les couleurs<br> <b>Contraste</b> plus de différence de luminosité<br> <b>Couleur ou dégradé</b> ajoute un filtre avec couleurs et transparence' name='filter' title='Filtre' values='none|grayscale|blur|invert|contrast|color' /><gradient default='['vertical', [['0%', 'rgba(0,0,0,0.5)'], ['100%', 'rgba(0,0,0,0.5)']], 0, false]' name='gradient_colors' /></bloc><bloc class='uii_mask_properties'><checkbox class='uii_active_mask' default='false' help='En cochant cette option, vous pourrez découper le contour de l'image suivant une forme choisie (cercle, triangle...).' name='activate_mask' value='Découper suivant une forme' /><icon_selector class='uii_chose_mask' default='{"id":594,"name":"brightness_1","service":"Google-material-icons","removable":false}' default_action='true' icon='folder' name='mask' search_options='{"search_by":"shapes"}' value='Choisir la forme' /></bloc><bloc class='uii_radius_properties'><checkbox class='uii_radius_toggle' default='false' name='radius_toggle' value='Arrondi' /><radius class='uii_radius' default='[50, 50, 50, 50]' maximum='500' minimum='0' name='radius' /></bloc></design_properties></view><script>UI_List.UI_Image={initialize:function(t){this.component=t
;t.setOptions(["locked","container","fixed","footer","sticky"])
;this.protect_available="editor"==v.mode||v.features.image_protection
;this.mouseover_available="editor"==v.mode||v.features.image_mouseover
},updateImage:function(){this.component.componentBody.unbind()
;var t=this,e={h:this.component.H(),w:this.component.W()
},o=function(o,i){var n=$("<span>").css({position:"absolute",
top:"-1000px"}).appendTo("body")
;n.setIcon(t.component.data.mask,!1,function(){
setTimeout(function(){
var a=cdn_url(bestImgSrc(i,t.component.W(),t.component.H())),s=function(){
n.children().css({"font-size":"100px"});var i={w:n.width(),
h:n.height()};i.h/i.w
;var s=document.createElementNS("http://www.w3.org/2000/svg","text")
;o.empty().addClass("uii_mask_node")
;var r=Math.min(e.h/i.h*100,e.w/i.w*100)
;s.setAttributeNS(null,"x",(e.w-r*i.w/100)/2);var c=r*i.h/100
;s.setAttributeNS(null,"y",(e.h-c)/2+c/("Symbola"!=t.component.data.mask.service?1:1.3))
;s=$.fn.setIcon(t.component.data.mask,$(s),function(){
var i='<pattern class="uii_pattern" id="'+(o==t.img2?"hover_":"")+"pattern_mask_"+t.component.uniqId()+'" patternUnits="userSpaceOnUse" width="'+e.w+'" height="'+e.h+'" viewbox="0 0 '+e.w+" "+e.h+'"><image xlink:href="'+a+'" width="'+e.w+'" height="'+e.h+'" preserveAspectRatio="xMidYMid '+("cover"==t.component.data.ratio_type?"slice":"meet")+'" /></pattern>'
;$(".pattern_mask",t.component.componentBody).remove()
;o.html("<svg class='svg_defs'><defs>"+i+"</defs></svg>").append($('<svg class="content_svg" width="'+e.w+'" height="'+e.h+'"></svg>'))
;$(".content_svg",o)[0].appendChild(s);$(s).css({
fill:"url(#"+(o==t.img2?"hover_":"")+"pattern_mask_"+t.component.uniqId()+")",
"font-size":r+"px"});setTimeout(function(){n.remove()},2e3)})}
;$.fn.loadImage(a).done(function(){s();t._setFilter()
}).fail(function(){if(/ra0\.cdnsw\.com\/cc0/.test(a)){
a=a.replace("ra0.cdnsw.com/cc0","www.sitew.com/file/pixabay")
;s()}})},100)})}
;if(this.component.data.activate_mask&&this.component.data.mask){
$(".uii_pattern",this.component.componentBody).remove()
;o(this.img1,t.component.data.imageFile)}else{
this.img1.removeClass()
;if(!this.component.preloaded||this._protected()||"fullwidth"==this.component.data.ratio_type){
this.img1.empty().append(t._setImageDefault(this.component.data.imageFile,this.component))
;this._protected()&&this._antiDownload(this.img1)}
this.mouseover_available&&this.component.data.mouseoverMenu&&""!=this.component.data.mouseoverMenu&&this.component.componentBody.mouseover(function(){
window.UI_Menu&&UI_Menu.showDropDownMenu(t.component.data.mouseoverMenu)
});this._setFullWidth();this._setParallax()}
if(this.mouseover_available&&this.component.data.mouseoverImage){
this.component.data.activate_mask&&this.component.data.mask?o(this.img2,this.component.data.mouseoverImage):this.img2.empty().append(t._setImageDefault(this.component.data.mouseoverImage,this.component))
;this.component.componentBody.hover(function(){t.img2.show()
;t.img1.hide()},function(){t.img1.show();t.img2.hide()})}
this._setFilter()},getDescriptions:function(){
var t=this,e=function(e){var o={}
;o[t.component.data.imageFile.id]=e;t.captions.resolve(o)}
;this.component.description&&e(this.component.description)},
updateLink:function(){var t=this;this.link.attr({target:null,
onClick:null,title:null}).removeAttr("href").unbind()
;if(this.component.data.link&&this.component.data.link.onClick&&this.component.data.link.onClick.match(/^tb_show\(/))try{
this.component.data.tb_imgs=JSON_.parse(this.component.data.link.onClick.match(/tb_show\(\{list:\[\]\},0,(.*\])/)[1])
;this.component.data.bigger=!0;this.component.data.link=null
}catch(e){dbg.error("Image.tb_imgs",e,this.component.data)}
if(this.component.data.link){
"viewer"==v.mode&&(this.component.data.link.href||"").match(/.(jpg|png)$/i)&&(this.component.data.link.href=this.component.data.link.href.replace(/(.*\/)([^\/]*)/,"$1original/$2"))
;this.link.attr(this.component.data.link)
;""==this.link.attr("href")&&this.link.removeAttr("href")
;"editor"==v.mode&&href&&href.match(/\/(fs|dl)\//)&&""==this.component.data.link.onClick&&this.link.on("click",function(e){
window.open(v.url+t.component.data.link.href);e.preventDefault()
})
;v.features.do_follow_links?this.link.attr("rel","noopener noreferrer"):this.link.attr("rel","nofollow noopener noreferrer")
}else this.component.data.bigger&&this.link.attr("href","#").click(function(){
if(t.component.data.tb_imgs&&t.component.data.tb_imgs.length>0)tb_show_viewer(FileDescription.get(t.component.data.tb_imgs),0,t.component.data.tb_imgs,t._protected());else{
tb_show_viewer("editor"==v.mode?FileDescription.get([t.component.data.imageFile]):t.captions,0,[t.component.data.imageFile],t._protected())
;sigCtl.emit("UI_Image.fullscreen",t.component.data.imageFile)}
this.blur();return!1}).on("dblc</article></body></html>

Avant travaux

Après travaux