今回はJavaScriptネタです。
こっち系はほとんど素人でぜんぜん得意ではありませんが、自分なりに考えてとってもナイスな方法を披露しちゃいます。
» Read more: Javascript ループ中にイベントリスナーを登録する最も簡単な方法
Archive for the ‘Ajax’ category
Javascript ループ中にイベントリスナーを登録する最も簡単な方法
2月 28th, 2010IE「このページは表示できません」
12月 29th, 2009javascriptでたまーーにIEのみ「このページは表示できません」とアラートされて読み込み中のページがキャンセルされてしまうときがある。
どうやら原因はDOM構築途中にDOM書き換えようとするとこのエラーがでるらしい。
» Read more: IE「このページは表示できません」
prototype scriptaculous.jsを使ったドラッグできるソート処理
11月 4th, 2009scriptaculous.jsを使ったドラッグできるソート処理を書くよ。
loadingアイコンの表示
10月 8th, 2009ajaxで通信中はユーザーにわかりにくいのでloadingアイコンでも表示させようと思った。
prototypeのElement.showとhideを使えば楽勝じゃんって思っていたのにちょっとハマったのでメモ。
» Read more: loadingアイコンの表示
javascript テーブル trの入れ替え
10月 1st, 2009javascriptでテーブルで並べられたデータの順番を入れ変えようと思った。
prototype.jsで動くscriptaculous.jsでsortableを使おうと思ったけど、
処理が重いのか動きが鈍すぎて使い物にならない。
とりあえずボタンクリックで上に移動、下に移動が実現できれば良しとした。
フォームタグの内容をjavascriptに渡す
3月 6th, 2008テキストボックスの内容をEnterキーでもJavascriptに渡せるようにする。
» Read more: フォームタグの内容をjavascriptに渡す
Highlight image hover effect (opacity or borderize)
10月 30th, 2007ちょっと変わったhoverイベントの書き方をしていたののがあったのでメモ
» Read more: Highlight image hover effect (opacity or borderize)
Ext.Message
10月 17th, 2007ようやく覚えだしたExtライブラリ。
まだまだ思ったような動きを作れない。。
まずは簡単な確認ダイアログの出力から。
function msgBox(){ Ext.MessageBox.show( { title: '確認!', msg: 'よいですか？', buttons: Ext.MessageBox.OKCANCEL, fn: fnDel, animEl: 'btnCheck' }); function fnDel(result){ if (result=="ok"){ document.location.href = path; } } }
Ext 2.0 Samples公開
9月 11th, 2007超クールなAjaxライブラリExtがつい最近1.1が正式リリースされたばかりなのに、もう2.0のを公開している・・。
とんでもない開発スピードに脱帽です＾＾；
これからじっくり1.1を覚えていこうと思っていたのになんてこった。。。
サンプルはとても素晴らしく更に高機能になってる。
だけど覚えようと思ってる側は大変＞＜
script.aculo.us Effect.toggleのメモ
9月 10th, 2007script.aculo.us Effect.toggleを使ったのでメモ
要素を半透明にしてabsoluteにして表示
<a href="#" onclick="Effect.toggle('d3','slide',{duration :0.2}); return false;">トグル</a> <span id="d3"> <a href="#" onclick="Effect.toggle('d3','slide',{duration :0.2}); return false;">閉じる</a> （トグルだけど表示された中身にも閉じるボタン） </span>
#d3 { position: absolute; /*浮かす*/ display: none; /*初期は非表示*/ filter: alpha(opacity=70); /*IE用*/ opacity: 0.7; /*Safari用*/ -moz-pacity: 0.7; /*FireFox用*/ }
実際に設置したのを簡略したメモなのでこのままでうまくいくか不明ｗ
2008/04/11 訂正
サンプルコードにsmarty literalが混ざっていたので修正
