効果音付きでアニメーションするクールなダイアログ実装jQueryプラグイン「Float Dialog」
2011年01月17日-
スポンサード リンク
ExpBuilder Float Dialog v3.0 - Easy PopUp - Expbuilder 2011
効果音付きでアニメーションするクールなダイアログ実装jQueryプラグイン「Float Dialog」。
ピコッと邪魔にならない程度の効果音付きでダイアログをアニメーションしてくれます。この効果音がなんとも分かりやすい上にいやらしさがないところがＧｏｏｄ。
画面を暗くする部分をアニメーションさせたり、ダイアログ自体をアニメーションさせられたりします。
背景色はグレーだけではなく別の色にも調整可能
効果音はmp3なので好きに置き換えることも出来ます。
サンプルコードは以下で、ダイアログ内のデータもHTML内にベタっと書くことができます。JSコードは1行でOK
<a id="linkid" href="javascript:void(0);">ここをクリックで表示</a>
<div id="dialogid">
<a href="javascript:void(0);" class="closebutton">X</a>
<h1>DIALOG DATA HERE !</h1>
</div>
<script>
$("#linkid").floatdialog("dialogid");
</script>
関連エントリ
効果音付きでアニメーションするクールなダイアログ実装jQueryプラグイン「Float Dialog」。
ピコッと邪魔にならない程度の効果音付きでダイアログをアニメーションしてくれます。この効果音がなんとも分かりやすい上にいやらしさがないところがＧｏｏｄ。
画面を暗くする部分をアニメーションさせたり、ダイアログ自体をアニメーションさせられたりします。
背景色はグレーだけではなく別の色にも調整可能
効果音はmp3なので好きに置き換えることも出来ます。
サンプルコードは以下で、ダイアログ内のデータもHTML内にベタっと書くことができます。JSコードは1行でOK
<a id="linkid" href="javascript:void(0);">ここをクリックで表示</a>
<div id="dialogid">
<a href="javascript:void(0);" class="closebutton">X</a>
<h1>DIALOG DATA HERE !</h1>
</div>
<script>
$("#linkid").floatdialog("dialogid");
</script>
関連エントリ
スポンサード リンク
By.KJ : 2011年01月17日 10:07 
間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- 小説表紙などに使えそうな商用可なフォント「になロマン」
- 筆で書いたようなカナ書体「筆竹仮名B」
- 無料・商用利用可な丸文字ピクセルフォント「マルミーニャＭ」
- スペースコブラ風フォント
- Next.jsのVercelから商用利用可能なフリー汎用フォント「Geist Font 」
- 無料で使えるいい感じの日本語フォント「しっぽり太ゴシック」
- CSSのみで実装された５００種類のローディングアニメーション「CSS Loaders」
- 画像ホバーで様々なエフェクトをかけられる「Izmir」
- CSSのbox-shadowをGUIで生成できる「CSS Box Shadows Generator」
- 好きな画像や文字を埋め込んだQRコードをリアルタイムで作れるWEBツール
- 過去のエントリ
