Via mir.aculo.us : Like reflections? Try the Reflector.
Le code sans les fichiers de script.aculo.us 1.6.1 :
[javascript] <script type="text/javascript"> var Image = { reflect: function(element) { element = $(element); options = $H({ amount: 1/3, opacity: 1/3 }).merge(arguments[1] || {}); if(!element.complete) { setTimeout(function(){Image.reflect(element,options)}, 10); return; } var p = element.parentNode, n = element.nextSibling; var d = 1.0/(element.height*options.amount); (element.height*options.amount).times( function(line) { var h = Builder.node('div',{style:'height:1px;overflow:hidden'}, [Builder.node('img',{src:element.src, style:'margin-top:-'+(element.height-line-1)+'px' })]); p.insertBefore(h,n); $(h).setOpacity((1-d*line)*options.opacity); }); } } Image.reflect('monimagereflechie'); </script>
Note : suite un petit bug intempestif de l’effet sur mon site, je ne mets que l’imprime écran de l’exemple de mir.aculo.us !
Ce que nos lecteurs en disent :
@zerty21
Shemu
Les commentaires sont clos.