ログインしてさらにmixiを楽しもう

コメントを投稿して情報交換!
更新通知を受け取って、最新情報をゲット!

WordPressコミュのjQuery UIが動かないです。

  • mixiチェック
  • このエントリーをはてなブックマークに追加
jQuery-UIを使った下記のソースを固定記事で表示したいのですが出来ません。
ブランクのテーマを作って試したのですが表示されませんでした。
どうしたら表示できるでしょうか。

------
<style>
/* ボタンの配置 */
.btn{
position:fixed;
right:10px;
top:0;
bottom:0;
margin:auto;
width:80px;
height:80px;
z-index:999;
}
</style>
<script>
/* ボタンのダイアログイベント */
$(function(){

// 画面表示時にダイアログが表示されないよう設定
$("#mydialog").dialog({ autoOpen: false });

// ボタンのクリックイベント
$("#btn_action").click(function(){
// ダイアログを表示する
$("#mydialog").dialog("open");
});

})
</script>

<?php /* ダイアログ用ボタン */ ?>
<button class="btn" id="btn_action">ボタン</button>

<?php /* ダイアログの内容 */ ?>
<div id="mydialog" title="サンプルタイトル">オリジナルダイアログをポップアップ表示するサンプル。</div>


<script>
$(function(){
// ダイアログの初期設定
$("#mydialog2").dialog({
autoOpen: false, // 自動的に開かないように設定
width: 500, // 横幅のサイズを設定
modal: true, // モーダルダイアログにする
buttons: [ // ボタン名 : 処理 を設定
{
text: 'ボタン1',
click: function(){
alert("ボタン1をクリックしました");
}
},
{
text: 'ボタン2',
click: function(){
alert("ボタン2をクリックしました");
}
},
{
text: 'ボタン3',
click: function(){
// ダイアログを閉じる
$(this).dialog("close");
}
}
]
});

$("#btn_action2").click(function(){
// ダイアログの呼び出し処理
$("#mydialog2").dialog("open");
});
})
</script>

<?php /* ダイアログ用ボタン */ ?>
<button id="btn_action2">ボタン</button>

<?php /* ダイアログの内容 */ ?>
<div id="mydialog2" title="サンプルタイトル">オリジナルダイアログをポップアップ表示するサンプル。</div>
------

コメント(0)

mixiユーザー
ログインしてコメントしよう!

WordPress 更新情報

WordPressのメンバーはこんなコミュニティにも参加しています

星印の数は、共通して参加しているメンバーが多いほど増えます。

人気コミュニティランキング