{"id":174,"date":"2007-02-27T11:39:57","date_gmt":"2007-02-27T10:39:57","guid":{"rendered":"http:\/\/www.gatellier.be\/blog\/?p=174"},"modified":"2008-08-07T17:36:42","modified_gmt":"2008-08-07T15:36:42","slug":"images-ombre-rotation-via-flash","status":"publish","type":"post","link":"https:\/\/gatellier.be\/blog\/images-ombre-rotation-via-flash\/","title":{"rendered":"Images avec ombre et rotation via flash"},"content":{"rendered":"<p>Bon, on sait que je n&#8217;adore pas le dieu Flash. C&#8217;est souvent mal impl\u00e9ment\u00e9 et donc casse l&#8217;accessibilit\u00e9 et l&#8217;<a href=\"\/blog\/utilisabilite-et-flash-menus-contextuels-maj\/\">utilisabilit\u00e9<\/a>.<\/p>\n<p>Toutefois, il existe des cas concrets o\u00f9 le flash a des avantages non n\u00e9gligeables.<\/p>\n<p>On connaissait <a href=\"\/\/www.gwix.net\/web_gwix\/article.asp?filID=252\">SIFR<\/a> &#8211; qui permet de changer les typos de texte \u00e0 l&#8217;aide de javascript, de css et de flash &#8211; ses avantages et ses inconv\u00e9niants (sur des grosse pages pleines de titres, le contenu est parfois vraiment long \u00e0 s&#8217;afficher sur un vieux pc).<\/p>\n<p>Dans la m\u00eame optique, vient d&#8217;arriver <strong><a href=\"\/\/www.swfir.com\/\" hreflang=\"en\" xml:lang=\"en\">swfIR<\/a><\/strong> pour swf Image Replacement.<\/p>\n<p class=\"centered\"><a href=\"\/blog\/?pp_album=1&#038;pp_image=swfir_exemple.png\"><img decoding=\"async\" src=\"\/blog\/wp-content\/photos\/swfir_exemple.png\" alt=\"Exemple de rendu d'image trait\u00e9e par swf Image Replacement\" title=\"Exemple de rendu d'image trait\u00e9e par swf Image Replacement\" \/><\/a><\/p>\n<p>Il permet d&#8217;ajouter des <strong>ombres port\u00e9es<\/strong>, des <strong>bords arrondis<\/strong> et des <strong>rotations<\/strong> (choses qu&#8217;on ne peut pas faire en css\/javascript) \u00e0 vos images sans devoir passer par votre \u00e9diteur d&#8217;image favori.<\/p>\n<p>Pour cela, on a juste besoin d&#8217;ins\u00e9rer un <strong>javascript<\/strong> dans sa page, d&#8217;avoir le fichier .<strong>swf<\/strong> ad\u00e9quat dans sa page et d&#8217;appeler une <strong>fonction javascript<\/strong> qui remplacera votre image par le fichier flash en question.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nsir = new swfir();\r\nsir.specify(&quot;border-width&quot;, &quot;20&quot;);\r\nsir.specify(&quot;border-color&quot;, &quot;#fff&quot;);\r\nsir.specify(&quot;src&quot;, &quot;\/swfir.swf&quot;);\r\nsir.swap(&quot;#example img&quot;);\r\n<\/pre>\n<p>Les m\u00e9thodes <code>specify<\/code> d\u00e9finissent les propri\u00e9t\u00e9s de l&#8217;image et la m\u00e9thode <code>swap<\/code> remplace l&#8217;\u00e9l\u00e9ment pass\u00e9 en param\u00e8tre (via la m\u00e9thode <acronym title=\"Document Object Model\" xml:lang=\"en\">DOM<\/acronym>  <code>document.getElementsBySelector<\/code> &#8211; que je ne connaissais pas)<\/p>\n<p>Je pense qu&#8217;on va voir cette m\u00e9thode fleurir aux quatres coins du web.<\/p>\n<h4>Liens relatifs<\/h4>\n<ul>\n<li><strong><a href=\"\/\/www.swfir.com\/\" hreflang=\"en\" xml:lang=\"en\">swfIR<\/a><\/strong><\/li>\n<li>plus d&#8217;exemples de <a href=\"\/\/www.swfir.com\/examples\/elastic\/\" hreflang=\"en\" xml:lang=\"en\">swfIR en action<\/a><\/li>\n<li>via : <a href=\"\/\/www.alistapart.com\/articles\/semanticflash\" hreflang=\"en\" xml:lang=\"en\">A List Apart<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Bon, on sait que je n&#8217;adore pas le dieu Flash. C&#8217;est souvent mal impl\u00e9ment\u00e9 et donc casse l&#8217;accessibilit\u00e9 et l&#8217;utilisabilit\u00e9. Toutefois, il existe des cas concrets o\u00f9 le flash a des avantages non n\u00e9gligeables. On connaissait SIFR &#8211; qui permet de changer les typos de texte \u00e0 l&#8217;aide de javascript, de css et de flash [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[39,51,54],"tags":[],"class_list":["post-174","post","type-post","status-publish","format-standard","hentry","category-flash","category-html","category-javascript"],"_links":{"self":[{"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/posts\/174","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/comments?post=174"}],"version-history":[{"count":0,"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/posts\/174\/revisions"}],"wp:attachment":[{"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/media?parent=174"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/categories?post=174"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gatellier.be\/blog\/wp-json\/wp\/v2\/tags?post=174"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}