Fichiers Flash, CSS et validateurs.. la fin de la guerre?

Fichiers Flash, CSS et validateurs.. la fin de la guerre? - Web design - Graphisme

Marsh Posté le 30-05-2006 à 13:30:23    

Ceci n'est pas une pub ni un spam, mais juste une solution à un problème rencontré assez souvent en matière de webdesign.
 
J'aime bien avoir un petit logo w3c valid sur mes pages.. le problème c'est que j'utilise des animations flash... et du CSS .. et il n'y à pas de compatibilité... j'ai fais pas mal de recherches, essayé plusieurs méthodes et j'ai enfin trouvé!
 
je conseil donc aux amateurs de sites valides qui veulent intégrer du flash d'aller avant toute chose jeter un oeil ici
 
J'ai testé la methode et CA MARCHE! mon site passe nickel les validation W3C, et avec des anim flash dedans.
 
Je met l'URL de mon site, pas pour avis ( chacun ses mauvais gouts ) , mais pour que vous puissiez verifier par vous même.
 
LXiR
 
Je pense que cette info meritait un message.
 
Cheers.


Message édité par Ardant le 30-05-2006 à 13:31:41
Reply

Marsh Posté le 30-05-2006 à 13:30:23   

Reply

Marsh Posté le 30-05-2006 à 14:52:14    

Pour les feneants qui comme moi veulent tout tout de suite voici ce qu'il faut faire :
 
insérer cette ligne de code dans votre page :
 

Code :
  1. <script type="text/javascript" src="http://www.monsite/swfobject.js"></script>


 
Ensuite inserer le code suivant a l'endroit souhaité
 

Code :
  1. <div id="flashcontent">
  2. Ecrivez ici le texte qui sera affiche si un internaute ne possede pas de plug-in flash.. on peu y mettre aussi des liens ou une image</div>
  3. <script type="text/javascript">
  4. // <![CDATA[
  6. var fo = new SWFObject("montruc_en_flash.swf", "montrucenflash", "300", "150", "8.0.5", "#FFFFFF" );
  7. fo.write("flashcontent" );
  9. // ]]>
  10. </script>


 
Explication : <div id="flashcontent"> représente le "bloc" qui va contenir l'anim flash ainsi que le texte alternatif qui s'affichera si le navigateur n'à pas de plug-in flash. Il convient donc de creer un style #flashcontent dans le cas ou votre site utilise une mise en page avec CSS.  
On remplace "montruc_en_flash.swf" par le nom de fichier de l'animation souhaité, dans l'ordre, les paramêtres 300, 150, 8.0.5 et #FFFFFF représentent la largeur en pixel de l'anim, la hauteur, la version du player flash nécéssaire, la couleur de fond.
 
Pour finir il faut copier le code suivant dans une nouvelle page que l'on va ensuite enregistrer sous : swfobject.js (dans un editeur de texte par exemple).. puis qui sera uploadé sur votre serveur dans le même repertoir que la page qui accueil les anims flash.
 

Code :
  1. if(typeof deconcept=="undefined" ){var deconcept=new Object();}
  2. if(typeof deconcept.util=="undefined" ){deconcept.util=new Object();}
  3. if(typeof deconcept.SWFObjectUtil=="undefined" ){deconcept.SWFObjectUtil=new Object();}
  4. deconcept.SWFObject=function(_1,id,w,h,_5,c,_7,_8,_9,_a,_b){
  5. if(!document.createElement||!document.getElementById){return;}
  6. this.DETECT_KEY=_b?_b:"detectflash";
  7. this.skipDetect=deconcept.util.getRequestParameter(this.DETECT_KEY);
  8. this.params=new Object();
  9. this.variables=new Object();
  10. this.attributes=new Array();
  11. if(_1){this.setAttribute("swf",_1);}
  12. if(id){this.setAttribute("id",id);}
  13. if(w){this.setAttribute("width",w);}
  14. if(h){this.setAttribute("height",h);}
  15. if(_5){this.setAttribute("version",new deconcept.PlayerVersion(_5.toString().split("." )));}
  16. this.installedVer=deconcept.SWFObjectUtil.getPlayerVersion(this.getAttribute("version" ),_7);
  17. if(c){this.addParam("bgcolor",c);}
  18. var q=_8?_8:"high";
  19. this.addParam("quality",q);
  20. this.setAttribute("useExpressInstall",_7);
  21. this.setAttribute("doExpressInstall",false);
  22. var _d=(_9)?_9:window.location;
  23. this.setAttribute("xiRedirectUrl",_d);
  24. this.setAttribute("redirectUrl","" );
  25. if(_a){this.setAttribute("redirectUrl",_a);}};
  26. deconcept.SWFObject.prototype={setAttribute:function(_e,_f){
  27. this.attributes[_e]=_f;
  28. },getAttribute:function(_10){
  29. return this.attributes[_10];
  30. },addParam:function(_11,_12){
  31. this.params[_11]=_12;
  32. },getParams:function(){
  33. return this.params;
  34. },addVariable:function(_13,_14){
  35. this.variables[_13]=_14;
  36. },getVariable:function(_15){
  37. return this.variables[_15];
  38. },getVariables:function(){
  39. return this.variables;
  40. },getVariablePairs:function(){
  41. var _16=new Array();
  42. var key;
  43. var _18=this.getVariables();
  44. for(key in _18){_16.push(key+"="+_18[key]);}
  45. return _16;
  46. },getSWFHTML:function(){
  47. var _19="";
  48. if(navigator.plugins&&navigator.mimeTypes&&navigator.mimeTypes.length){
  49. if(this.getAttribute("doExpressInstall" )){this.addVariable("MMplayerType","PlugIn" );}
  50. _19="<embed type=\"application/x-shockwave-flash\" src=\""+this.getAttribute("swf" )+"\" width=\""+this.getAttribute("width" )+"\" height=\""+this.getAttribute("height" )+"\"";
  51. _19+=" id=\""+this.getAttribute("id" )+"\" name=\""+this.getAttribute("id" )+"\" ";
  52. var _1a=this.getParams();
  53. for(var key in _1a){_19+=[key]+"=\""+_1a[key]+"\" ";}
  54. var _1c=this.getVariablePairs().join("&" );
  55. if(_1c.length>0){_19+="flashvars=\""+_1c+"\"";}
  56. _19+="/>";}else{if(this.getAttribute("doExpressInstall" )){this.addVariable("MMplayerType","ActiveX" );}
  57. _19="<object id=\""+this.getAttribute("id" )+"\" classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" width=\""+this.getAttribute("width" )+"\" height=\""+this.getAttribute("height" )+"\">";
  58. _19+="<param name=\"movie\" value=\""+this.getAttribute("swf" )+"\" />";
  59. var _1d=this.getParams();
  60. for(var key in _1d){_19+="<param name=\""+key+"\" value=\""+_1d[key]+"\" />";}
  61. var _1f=this.getVariablePairs().join("&" );
  62. if(_1f.length>0){_19+="<param name=\"flashvars\" value=\""+_1f+"\" />";}_19+="</object>";}
  63. return _19;},write:function(_20){
  64. if(this.getAttribute("useExpressInstall" )){
  65. var _21=new deconcept.PlayerVersion([6,0,65]);
  66. if(this.installedVer.versionIsValid(_21)&&!this.installedVer.versionIsValid(this.getAttribute("version" ))){
  67. this.setAttribute("doExpressInstall",true);
  68. this.addVariable("MMredirectURL",escape(this.getAttribute("xiRedirectUrl" )));
  69. document.title=document.title.slice(0,47)+" - Flash Player Installation";
  70. this.addVariable("MMdoctitle",document.title);}}
  71. if(this.skipDetect||this.getAttribute("doExpressInstall" )||this.installedVer.versionIsValid(this.getAttribute("version" ))){
  72. var n=(typeof _20=="string" )?document.getElementById(_20):_20;
  73. n.innerHTML=this.getSWFHTML();return true;
  74. }else{if(this.getAttribute("redirectUrl" )!="" ){document.location.replace(this.getAttribute("redirectUrl" ));}}return false;}};
  75. deconcept.SWFObjectUtil.getPlayerVersion=function(_23,_24){
  76. var _25=new deconcept.PlayerVersion([0,0,0]);
  77. if(navigator.plugins&&navigator.mimeTypes.length){
  78. var x=navigator.plugins["Shockwave Flash"];
  79. if(x&&x.description){_25=new deconcept.PlayerVersion(x.description.replace(/([a-z]|[A-Z]|\s)+/,"" ).replace(/(\s+r|\s+b[0-9]+)/,"." ).split("." ));}
  80. }else{try{var axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash" );
  81. for(var i=3;axo!=null;i++){axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash."+i);_25=new deconcept.PlayerVersion([i,0,0]);}}
  82. catch(e){}
  83. if(_23&&_25.major>_23.major){return _25;}
  84. if(!_23||((_23.minor!=0||_23.rev!=0)&&_25.major==_23.major)||_25.major!=6||_24){
  85. try{_25=new deconcept.PlayerVersion(axo.GetVariable("$version" ).split(" " )[1].split("," ));}
  86. catch(e){}}}return _25;};
  87. deconcept.PlayerVersion=function(_29){
  88. this.major=parseInt(_29[0])!=null?parseInt(_29[0]):0;
  89. this.minor=parseInt(_29[1])||0;
  90. this.rev=parseInt(_29[2])||0;};
  91. deconcept.PlayerVersion.prototype.versionIsValid=function(fv){
  92. if(this.major<fv.major){return false;}
  93. if(this.major>fv.major){return true;}
  94. if(this.minor<fv.minor){return false;}
  95. if(this.minor>fv.minor){return true;}
  96. if(this.rev<fv.rev){return false;}return true;};
  97. deconcept.util={getRequestParameter:function(_2b){
  98. var q=document.location.search||document.location.hash;
  99. if(q){var _2d=q.indexOf(_2b+"=" );
  100. var _2e=(q.indexOf("&",_2d)>-1)?q.indexOf("&",_2d):q.length;
  101. if(q.length>1&&_2d>-1){return q.substring(q.indexOf("=",_2d)+1,_2e);}}
  102. return "";}};
  103. deconcept.SWFObjectUtil.cleanupSWFs=function(){
  104. var _2f=document.getElementsByTagName("OBJECT" );
  105. for(var i=0;i<_2f.length;i++){
  106. for(var x in _2f[i]){if(typeof _2f[i][x]=="function" ){_2f[i][x]=null;}}}};
  107. if(typeof window.onunload=="function" ){
  108. var oldunload=window.onunload;
  109. window.onunload=function(){deconcept.SWFObjectUtil.cleanupSWFs();oldunload();};
  110. }else{window.onunload=deconcept.SWFObjectUtil.cleanupSWFs;}
  111. if(Array.prototype.push==null){
  112. Array.prototype.push=function(_32){
  113. this[this.length]=_32;
  114. return this.length;};}
  116. var getQueryParamValue = deconcept.util.getRequestParameter;
  117. var FlashObject = deconcept.SWFObject; // for backwards compatibility
  118. var SWFObject = deconcept.SWFObject;


 
 
et voila!.. prochain message 'ajouter quelques variables'


Message édité par Ardant le 30-05-2006 à 14:53:42
Reply

Marsh Posté le 30-05-2006 à 14:57:44    

Ha oui chose à ne pas oublier, le code est la création de Geoff Stearns

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed