category
サイト構築 -JavaScript

[JS]ページを表示した時にパネルをするっと表示するスクリプト

  • この記事をdel.cio.usに登録する
  • この記事をはてなブックマークに登録する
  • この記事をGoogleブックマークに登録する
  • この記事をYahoo!ブックマークに登録する
  • この記事をdiggに登録する
  • この記事をlivedoor clipに登録する
  • この記事を@nifty クリップに登録する

広告掲載などに最適なパネルをページの下部からアニメーションで表示するスクリプトをEmanuele Feronatoから紹介します。

デモのキャプチャ

Create a dynamic content animated footer ad for your site in just 9 jQuery lines
デモページ

デモではページを表示した際に、下部からパネルがアニメーションでスライドしながら表示されます。
パネルはスクロールしても定位置に固定表示されており、非表示にするには「Close」をクリックします。

実装は簡単で、</body>の直前にパネル用のdiv要素を配置します。

HTML

パネルに表示する内容は外部ファイルで処理しています(広告用だから?)。下記のJavaScriptの「ajax.php」が外部ファイルです。

スクリプトのベースにはjQueryが利用されており、下記のシンプルなスクリプトで実装されています。

JavaScript

Post on:2010年3月5日

  • この記事をdel.cio.usに登録する
  • この記事をはてなブックマークに登録する
  • この記事をGoogleブックマークに登録する
  • この記事をYahoo!ブックマークに登録する
  • この記事をdiggに登録する
  • この記事をlivedoor clipに登録する
  • この記事を@nifty クリップに登録する

トラックバック

トラックバック(URL)

コメント

comment:

※承認制のため、即時には反映されません。

10時のヘッドライン | CROSS SBM
on 2010年3月5日

[...] | コリスはてブ:4 [JS]ページを表示した時にパネルをするっと表示するスクリプト | コリスはてブ:9 日本の中学校の映像を観た外国人たちのコメントはてブ:7 [...]

[リンク] links for 2010/3/4-5 | Bonnie styles.
on 2010年3月5日

[...] webdesign[JS] ページを表示した時にパネルをするっと表示するスクリプト | コリス [...]

ページの先頭へ




© coliss

RSS