jQuery
jQueryでRetinaディスプレイを判別して処理を変える方法 | BlackFlag window.devicePixelRatio が2ならretinaディスプレイで、 1ならretinaディスプレイではない。ということを念頭において、 画像さしかえとかを行うといいんじゃないか? $('div.hoge a img'…
.hoge { left: 3%; } みたいなのがあって、leftの値を取得したいときって、 $('.hoge').css('left'); ってすればleftの値を取得できる筈なんだよね。 「○○%」みたいな出力を期待していたのだ。 ところが、返ってきた値は以下のようになっている。 30.3500061…
animate(params, [duration], [easing], [callback]) - jQuery 日本語リファレンスanimate関数には4つの引数がある。1 {height: “100px”}などの値(backgroundなど数値型の値を取らない属性は変更できない こんな例外もあるけど) 2. アニメーションの動作期間…
こんなサイトを発見してしまって、とても便利かもしれないと漢字マスター jQueryのUIのサンプル集。 jQuery UIこんな感じで、ドラッグ&ドロップとか、クリックでのshow hideのアニメーションとかを確認できる。 ソースコードもあるから、サンプルコードを基…
普通にshow hideしてもいいけど、こういう方法もあるよ。 empty()する前に、html()で要素の中身を取得する。 変数に要素の中身を格納して、その変数を利用して もっぺんappendする。 <html lang="ja"> <head> <meta charset="utf-8"> <title>hoge</title> </head> <body> <div id="container" style="width: 100%; height: 400px"><p>ふが</p></div> </body></html>
リンク集とか総集編とか、そういうエントリーはあまり好きではないのは分かっているんだけど、 まだモノに出来ていないので…jQueryでフレームワークのバリデーションを実現するプラグインValidationのご紹介。公式 Page not found | jQuery Learning Center…
下記はクリックしたらスライドのイベントが発生する。 ちょっとコードが重複しててめんどくさいね。 $('div.sukeroku h2').click(function() { $(this).next().slideToggle('fast'); }); $('div.sayaka h2').click(function() { $(this).next().slideToggle(…
各要素の透明度を操作して、非表示の要素をフェードイン表示させる。アニメーション効果は指定したスピードで実行される。 速度は、”slow”、”normal”、”fast”、もしくは完了までの時間をミリ秒単位で指定。 ”1500”は、1.5秒でアニメーションを実行する。 デ…
jQueryでRSSフィードを読み込むプラグインです。使いかたは、公式のDownloadからzipファイルをダウンロードして、 RSS Feeds Reader Plugin for jQuery - Zazar Online Website Builder以下のように書くだけ。(一例) <html lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> </meta></head></html>
たとえば、 僕のブログの「カテゴリー」のところのようなセレクトメニューの要素は $('select').css('top', '30px); という風に書く。
jQueryでEnterキーでのSubmitを防止する : Nacky - Snowland.netフォームにフォーカスが当たっているときに エンターキーが押下されてもsubmitされないようにする。e.whichとe.keyCodeを併用しているのは、ブラウザ対策だから。 keyCode と which の違いにつ…
jQuery Howto: jQuery: How to disable form element, link, etc.フォームの送信ボタンなどを無効にしたり、有効にしたりする方法について。 無効にしたいときは、特定の要素にdisabled属性を追加する。 有効にしたいときは、追加したdisabled属性を削除する…
最初の要素の、親要素からの相対的な表示位置を返します。 <p>Hello</p><p></p> var p = $("p:first"); var position = p.position(); $("p:last").text( "left: " + position.left + ", top: " + position.top ); ちなみに、offsetは最初にマッチした要素の現在の位置を取…
textや、htmlを使うとよいでしょう。 $(function() { window.alert( 'htmlメソッド：' + $('li').html() + '\n' + 'textメソッド：' + $('li').text() ); }); textは要素の中身のみ、htmlはタグも取得するなど、 微妙に違いがある。
height() - jQuery 日本語リファレンス最初の要素の高さをピクセル単位で取得します。 jQuery1.2からは、このメソッドでwindowやdocumentの高さも取得できるようになりました。 $("p").height(); みたいな。
jQueryのanimateで自由にアニメーションできるようになろう | webOpixel 特定の要素に対しアニメーションを仕掛けるまずはこれを覚えるべし。 $('セレクタ').animate({ '動かすプロパティ': '目標地点の数値' });サンプル。 <html lang="ja"> <head> <meta charset="utf-8"> <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> </meta></head></html>
最初の要素の、ドキュメント上での表示位置を返す。 戻り値のオブジェクトはtopとleftの2つの数値を持つ。 この関数は、可視状態にある要素に対してのみ有効である。 (つまりhideとかで隠された要素については無効)こんな風に要素についてoffsetを使うと、表…
jQuery.jsで読み込み時に自動でフォームにフォーカス | muzin // ロード時に自動でカーソルを合わせる $(document).ready( function() { $("#hoge").focus(); });
こんな感じの簡単なHTMLがあったとしましょう。 <html lang="ja"> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="./ex4.css" /> <script type="text/javascript" src="./js/jquery-1.4.4.min.js"></script> <title>Hoge</title> </head> <body> <ul class="sakurai"> <li class="testarossa"></li></ul></body></html>
子孫要素を取得する $(hoge,this); $(this).find(hoge); findで子も孫もまとめて取れる子要素を取得する $(this).children(hoge);
オデの日記＠WEB系: jQueryでクリックされたエレメントの属性を取得する $("a").click(function() { id = $(this).attr("id"); // idの取得 val = $(this).attr("value"); // valueの取得 val = $(this).val(); }); などなど。
たとえば、こんな感じのcssがあったとしましょう(適当) ul.hoge li{ background-color: #eeeeee; background: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#000000), to(#ffffff)); background: -moz-linear-gradient(bottom, #000000, #ffffff); backgr…
jQuery CSSの値を削除 ~ プログラムのメモ $( "#test" ).css( "color", "red" ); // 文字色を赤に設定 $( "#test" ).css( "color", "" ); // 文字色の指定を削除
【jQuery】ラジオボタンの値の取得 at softelメモラジオボタンのセレクタの書き方は以下のとおり。 $('input[type="radio"]') //素直にtype属性がradioの要素 $('input:radio') //こんな書き方もできる（すべてのラジオボタン。 :radio や *:radio も同じ。…
prototype.jsと同時に使うには - jQuery 日本語リファレンス まず両方のライブラリを取り込まなければいけませんが、呼び出し順を必ずjQueryが後になるようにして下さい。 とあります。先にjQueryを呼び出し、後にprototypeを呼び出したのではコンフリクトが…
おしゃれjQuery、Good Parts、Bad Parts - 素人がプログラミングを勉強していたブログjQueryは互換性を保ちつつも洗練されたAPIを取り入れているので、 新しく書くときは新しいAPIを使った方が良い。liveとかセレクタの:hoverとかはNGである。jQuery.fn.on /…
cookieがあったら、何かしらの処理をするコードを書くとして、 elseがデフォルトになる(cookieが無い処理がデフォルトになる) // クッキーがあれば、何かしらの処理をする if ($.cookie("SHIGEMK2_hoge1")) { $('div.hoge1').addClass("ikachan"); } else if…
まずオプションのchartで、どこにどのようなグラフを描画させるかを 大まかに決める。 var options = { chart: { renderTo: 'chart1', // グラフを描画するdiv#idの場所 defaultSeriesType: 'pie', // グラフのタイプ width: 700 // グラフの横幅 }, // titl…
Highcharts の使い方 - by shigemk2 上記に大まかな概要が書いてあったりする。 リンクのコードのseriestypeをpieにするだけ…ではダメで(笑)新JavaScript例文辞典 $(function() { var chart = new Highcharts.Chart({ chart: { renderTo: "container", defau…
ハイクオリティのグラフ生成JavaScript「Highcharts」｜skuare.net もうそのままなのだけれど… jQueryのプラグインの一つで、簡単にグラフを出せるプラグインである。 highcharts.jsを読み込むことで発動する。 <script type="text/javascript"> $(document).ready(function() { var categor…
