- ベストアンサー
広がるバナーのような物を作りたい。
http://www.nikkei.co.jp/ad/logo/2008a/test/BizPlus/TestLufthansa080512.html 上記のページのグローバルナビの下にあるバナーは初回アクセス時には自動的にＨＴＭＬや文字を押しのけて拡大します。 次回からはクリックしたときに拡大します。 これにはどんな技術が使われているのでしょうか？ 今、これと似たような物で １．オンマウスした時に拡大する。 ２．スライドしながら広がって行く。 ３．文字やＨＴＭLは押しのけ無くても良い。（重なって良い） という形で作ろうと思っています。 作成するのに必要な情報を教えていただけると助かります。
- pochitarou
- お礼率91% (268/292)
- JavaScript
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
練習用 <html> <body> <span onMouseOver="st()">な</span>んだよあの通り魔事件！<br> なんだよあの通り魔事件！<br> なんだよあの通り魔事件！<br> なんだよあの通り魔事件！<br> なんだよあの通り魔事件！<br> <div id="p" style="display:hidden;position:absolute;top:50;left:50;width:0px;height:0;overflow:hidden;background-color:#fee;"> それにしても、専門家と名乗るには どんな資格が必要なのだろう？ 一般人のほうが凄いと思われる 人がいるぞ！その人たちは謙そんか？ </div> <script> var f=0; function st(){ if(f==0){ f=1; $('p').style.display='block'; $('p').style.pixelWidth=0; $('p').style.pixelHeight=0; } if(f>0){ $('p').style.pixelWidth+=10; $('p').style.pixelHeight+=5; f+=1; if(f<30) setTimeout('st()',20); else { f=0; } } } </script>
その他の回答 (1)
- oka5130
- ベストアンサー率66% (35/53)
上記のページと似たようなものを作るために必要な知識・技術は以下のようなものです。 ・スタイルシートの知識（拡大はheightの値を少しずつ大きくしています） ・JavaScriptのイベントハンドラ（onclickやonmouseoverなど） ・DOMの知識が少々とJavaScriptでスタイルを変更する方法 ・JavaScriptのsetInterval関数（少しずつ大きくするために必要です） ただ、一から作るとなかなか思ったように動かないことが往々にしてありますので、 script.aculo.usなどのライブラリを使う方が楽かと思います。 http://script.aculo.us/
お礼
回答ありがとうございました。 更なる研究に役立てます。
お礼
スクリプトサンプルまで書いていただいてありがとうございます。 参考になりました。 ただ、この場合だとfirefoxとか動かないブラウザもあるみたいですね。 まあ、当面ieが動けばいいんですが。。。