スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

swfobject.js設置方法

昔はJavaスクリプト等でプルダウンメニューを作っても、プルダウンする箇所にFlashがあると、Flashの下にそのプルダウンが潜ってしまう…っていうのは当たり前のご法度だったように思う。
なので苦肉の策で、該当のページだけプルダウンメニューもFlashで…と考えていた私はもう浦島太郎状態。。。_| ̄|○
いつの間にか進化してるのです。
あぁ、ずっとこの世界に居るのに、何やってんだか(-_-;)

そして、Flashの設置はドリ(Dreamweaver)にお任せで自動既成される「swfobject_modified.js」や「expressInstall.swf」に目をつむってきた私でした。
(しつこいですが、Javaスクリプトとか苦手なもので、下手にカスタマイズして我流なものを設置するよりも、少々ソースが汚れてもドリのせいにした方が気が楽だったのです)

が、しかし。
今回、担当しているサイトのリニューアルを機に一念発起。
やはりせっかく一から作り直せるんですから、仕様をすべて見直したくなり、Flashの設置についてあれこれお勉強。
で、見つけました、swfobject.js

こんな良いものがあったのですね、感動。。。(T_T)
これなら簡単に設置できるし、更新時のFlashのバージョン操作もカンタン♪
しかも代替えの画像等やテキストも好きに設置できるし!!!
この代替え画像でFlashのインストールとJavaスクリプトの有効設定をお願いしとけば、それぞれの対策なんかもう必要ないじゃん♪♪♪(…って、こんなこと、他の方々はトーゼンなんでしょうね…すみません)
ただちょっと悩むのが、<noscript>の記述。
これがあれば、私的には<noscript>要らないと思うんですが…、偽善でも置いとくべきなんですかね…?

ただ、最初に述べたように、プルダウンを上に出す方法で、悩みまくったので覚書しときます。
いや、解説してあるサイトは多々見かけたのですが…SWFObject 2.2での記述方法を見つけるのに苦労したので。(ほとんどが1.5だったんですよね)

JavaScript(function.js)
  1. params = {};

  2. params.wmode = 'Opaque'; //Flashの背景を不透明化(透明化:Transparentでも良い)

  3. params.scale = 'noscale';

  4. swfobject.embedSWF(

  5. 'swf/myflash.swf', //swfファイルへのパス(必須)

  6. 'flashanim', //置き換えるID(必須)


  7. '600', //swfの横幅(必須)

  8. '300', //swfの高さ(必須)

  9. '10.0.0', //必要とするFlashPlayerのバージョン(必須)

  10. '', //expressInstall.swfのURI(任意)

  11. '', //flashvarsオブジェクト(任意)

  12. params //paramsオブジェクト(任意)

  13. );



HTML
  1. <head>
  2. <script type="text/javascript" src="js/swfobject.js"></script>
  3. <script type="text/javascript" src="js/function.js"></script>
  4. </head>
  5.  
  6. <body>
  7. <div id="flashanim">
  8. <img src="images/daigae.jpg" alt="" width="600" height="300" border="0" />
  9. </div>
スポンサーサイト

コメントの投稿

非公開コメント

Profile

chiemi09

Author:chiemi09

JavaスクリプトもActionスクリプトも苦手なWebデザイナー。
せめてjQueryのカスタマイズができればと仕事の合間にお勉強中です。

Recent Entries
Archives
Theme
Search
RSS
Bookmarks
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。