Basé sur phatfusion image Menu. pour mootools Menu 1 Menu 2 Menu 3 Menu 4 Testé sous Opéra 9, Firefox 2, IE6+ Téléchargement jquery.imageMenu.js Archive zip (source + exemple) Nécéssite jQuery 2008-09-02 : mise à jour complet du code Supression de la version incluse de jQuery (utilisation de ajax.googleapis.com) Nouvelle méthode d'appel à la librairie $(monSelecteur).ImageMenu({... o
jQueryでリストを開閉させたい こちらの記事、サンプルを拝見して。 Css Globe - Sitemap Styler: Style your Sitemaps with CSS and Javascript 英文なのだが、上記ページの「Examples」の部分の各サンプルを見れば何がしたいかはすぐに分かると思う。サイトマップだけでなく、いろんな場所で使えそう。動きも気持ちいいし、是非使ってみたいと思ったのだが、実際使ってみるとダダーと下階層のulリストを開くためには左の「+」マークを的確にポチっとしないといけない。またjs無効の際、下階層のulリストはCSS側で「display:none;」になっているので、そのままでは中身が表示されない。 じゃあそれ、jQueryでやってみよう。 もう少し自分好みな感じにできないかなーということで、jQueryでやってみることにした。対象となるペ
jQueryとCakePHPの異種格闘技戦。jQueryが勝っとる。これからはjQueryか。prototypeはそれ自体が汎用的な単語のため、フェアな勝負にならない。 そういうわけでjQueryのajaxを使ってみて(とりあえず挫折)したのでメモ。(いや、ajaxを使うというだけなら簡単。使い方が悪いだけ。) $.ajax()を使えばいい。 $.ajax({ url: 'hogehoge.htm', type: 'POST', dataType: 'json', // xml、 html、script、json data: params, timeout: 1000, error: function(){ // エラー時 alert('Error'); }, success: function(htm){ // コールバック } }); 上記コードで’hogehoge.htm’にpost
もはや jQuery なしでは JavaScript が書けない状態なんだけど、Greasemonkey で使うためには一工夫必要だったのでメモしておく。 参考にしたところ http://d.hatena.ne.jp/ysano2005/20060127/1138382734 http://d.hatena.ne.jp/lurker/20060813/1155432961 方針 HTMLにscriptタグを埋め込まない。 ページ表示時に毎回ロードするのは手間なので、ローカルにスクリプトを保存する。 unsafeWindow.$じゃなくて、$だけで使えるようにする。 コード 実際のコードはこんな感じ。 loadJQueryを呼び出すところは任意のイベントで構わない。 (function() { const DEBUG = true; const KEY_JQUERY = "my_jquery
画面に対する絶対的な座標の取得方法はすぐ見つかったが、画像の左上を基点とする座標を取得する方法を見つけるのに手間取ったのでメモ。 マウス座標の取得方法には色々ある(offsetXやらlayerXやら)ようだが、ブラウザによって取得できる値が異なるみたい。IEの場合はoffsetX、offsetYで指定した要素の座標を取得できるようだが、Firefoxでは画面に対する座標しか取得する方法が見つからなかった。 jQueryのプラグインで、Dimensionsというのを使うと取得できた。http://jquery.com/plugins/project/dimensions 指定したエレメントの幅や高さ、相対的、絶対的な位置を取得することができる。 script type="text/javascript" src="/static/javascripts/jquery-1.1.3.1.js"
某 endless 氏より「マルチプルセレクトの値って jQuery でどうやって取るの?」な質問が飛んで来たよ。 プラグインとかにありそうだけど、今回は勉強ついでに自分で書いてみる事に。さらに勉強ついでにプラグインにしてみる。 HTMLはとりあえずこんな感じ。 <form id="target_form" method="post"> <select name="hoge" multiple="multiple"> <option value="0">zero</option> <option value="1">one</option> <option value="2">two</option> <option value="3">three</option> <option value="4">four</option> </select> <select name="hige"
Ajax, Ajax, Ajax... = 日本全国ラボめぐり:グループウェアの新しい使い方「ひとり言スレ」──サイボウズ・ラボ - ITmedia Biz.ID もうちょっとマシな写真はなかったのかと問いたい…orz = Ratingを使おうかと思っていたけど、 微妙に気に入らないところがあって、修正するよりシンプルなのを自分で作る方がいいと判断。 = jQueryに値を渡すためにDjangoのカスタムテンプレートタグ作っててちっともAjaxの勉強になってない! $(".rating .button").click(function(){ alert("hello"); return false; }); が動かないなぁと思ったら $(document).ready(function(){ }) で包まないといけないのか… お、動いた動いた。 = JavaScriptはデフォルト
DjangoのJSONデータ生成処理も、jQueryのタグ生成処理もなかなか使いやすい。 jQueryでサーバサイドを呼びだし、サーバサイドでDjangoでModelのリストをJSON化してクライアントに返し、それをselectタグ内のoptionタグとして生成する。 views.py from django.core import serializers from django.http import HttpResponse from testapp.main.models import * ... def models_reload(request): model_list = Model.objects.all() data = serializers.serialize("json", model_list[:30], ensure_ascii=False) return Htt
少し前に書いた記事で書いた、ThickBox3をJQuery1.1.3.1で使った場合IE6で真ん中に表示されない件。取りあえず自分はひとつ前のJquery1.1.2を使うかほっとく(!)ことで対処してたんですが、その後ThickBox内のコードを一部修正することで対応する方法がメーリングリストに投稿 されてました。 Nabble – JQuery – latest jQuery and thickbox 2 thickbox.js内の270行目 if ( !(jQuery.browser.msie && typeof XMLHttpRequest == 'function')) { // take away IE6 この部分を、以下の様に修正 if ( !(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away
Djangoを使う時はJavascriptライブラリにjQueryを使うのが流行らしい。jQueryは最近注目されている楽しいライブラリのようなので、以前prototype.jsで実装した、チェックボックス一括チェック処理を書き換えてみる。 script type="text/javascript" src="/static/javascripts/jquery-1.1.3.1.pack.js">script> script type="text/javascript"> script> form action="sample" method="POST"> table> tr> th style="text-align: center;">input id="check_ctrl" type="checkbox" />th> th>タイトルth> th>詳細th> tr> {% for
■ チェックボックスに連動してフォームを無効に チェックボックスにチェックを入れた時だけ、foo というフォームを入力可能にしようと思い、 覚えたての jQuery を使って以下のように書いてみた。 $(function() { if ($("#checkbox")[0].checked) { $("#foo").removeAttr("disabled"); } else { $("#foo").attr("disabled", "disabled"); } $("#checkbox").click(function() { if (this.checked) { $("#foo").removeAttr("disabled"); } else { $("#foo").attr("disabled", "disabled"); } }); }); もっとまとめられると思うが、とりあえずは
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く