テーブルのヘッダを固定してスクロールする jQuery プラグイン – OTCHY.NET
Excel のウィンドウ枠の固定のように、テーブルのヘッダや左側を固定して、残りの部分をスクロールさせるための jQuery プラグインを書きました。 マークアップはシンプルで、普通にテーブルを書いたら、jQuery の作法でプラグインを呼び出すだけです。 jQuery のおれおれプラグインはいくつか書いた事がありましたが、こうやって公開するのは初めてです。ごてごての機能が欲しいんじゃなくて、単に既存のテーブルを固定スクロール化したいだけの時に、いいのが見つからなくて書いたので、けっこうニーズがあるんじゃないかと思ってます。 下記は簡単なサンプルです。詳細は専用ページを見てみて下さい。 HTML <table id="tablefix"> <thead> <tr> <th rowspan="2">ヘッダA</th> <th rowspan="2">ヘッダB</th> <th colspan
遅延ロードでJavaScriptのお勉強 - Born Neet
となっています。 わかりにくいのは、checkですね^^ この関数では、外部jsの読み込み完了を判断する必要がありますが、JSにはそんな機能はありません。 （っていうか外部ファイルのロード自体もHTMLを利用して実現してるぐらいです） ただ、多くのjsファイル（ライブラリは特に）読み込まれるとグローバル領域に何かしらのオブジェクトを作ります。 なので、そのオブジェクトの有無をチェックすることで、外部jsのロード完了をしろうというわけです。 jQueryだと、window.jQueryがそのオブジェクトになります。（window.はグローバルを示します） function load(src, check, next) { } と書かないのは、前者の方が汎用性が高いためだと思われます。 if文等ブロック内に書けたりとかするので。 （function文だと関数の中に書けないからこっちの形にしてる
jQueryでjsonデータを扱ってみる【入門編】
Posted: 2010.07.25 / Category: javascript / Tag: jQuery, json javascriptで外部のWebサービスを利用するデータ形式はjsonを使うことが基本なようです。 似たようなフォーマットとしてXMLがありますが、こちらはHTMLと同じマークアップ言語なのですんなり入っていける反面、jsonは少々わかりずらいといった先入観があったりするんじゃないでしょうか。 そこで入門編と題して（入門編しかない!）改めて基礎から勉強していけたらと思います。 とにかくシンプルなjson jsonデータは基本は外部から読み込むことになりますが、練習なのでとりあえずjavascript内の変数内に直に書きます。 「:（コロン）」で区切ったキーと値を一組として、２組目を「,（コンマ）」で区切って記述していきます。 それらを{}で囲むことで一つのオブジェク
ざっくり覚えて始められる jQueryセレクタ入門
最もよく使うjQueryセレクタ5つ 最新版のjQueryセレクタは、属性への対応はもちろんのこと、等価演算や否定演算も使うことができ、ほぼプログラミングの領域に入っているといっても過言ではない状況にあります。 ただ、たくさんのことができるようになった現状でも実際に使うものは限られてきます。これは、パフォーマンスのことを考えたときにも、シンプルかつ中身がよく分かるものを使うという意味で重要です。 そこで、下に実際よく使うセレクタについてまとめてみました。基本的には、ここで取り上げるセレクタのみを覚えていれば、大丈夫です。 【1】IDに一致
「jQuery」IEだとselectタグにname属性が設定できない - astrsk_horiの日記
現在、動的にselectタグを追加するページを作成しているのだがattr関数でname属性を追加するとIEの挙動がおかしい。 ■現象 まずjavascript（jquery1.3.2） $select_append = $('<select>').attr("id", "idA").attr("class", "classA").attr("name","nameA"); $select_append.append($("<option>").attr("value", "").attr("label", "labelA").text("textA")); //divに追加 $("#testA").append($select_append); alert($("#testA").html); HTMLは空DIVを配置のみ <body> <div id="testA" /> </body>
[作って学ぶ！jQuery] 第1回 セレクタを学ぶ | バシャログ。
「作って学ぶ！jQuery連載」の2回目なんだけど、1回目。今回はセレクタについてです。 jQueryを理解するで欠かせないのがセレクタ。セレクタの種類は数多くありますが、今回は現場でよく使うであろうものについてご紹介します。 基本系 要素セレクタ DOM要素（htmlタグ）を指定する方法です。 $('h1') $('ul') $('div') IDセレクタ = $('#myid') #で始まるセレクタは、id名を指定する方法です。なおidはページ内にて常にユニークである必要があります。 $('#header') CLASSセレクタ = $('.myclass') ドット（.）で始まるセレクタは、class名を指定する方法です。class名のみでの指定は、ドキュメント内を全て探しにいくので表示速度に影響もあります。IDセレクタと併用するのが望ましいです。 $('.link') グループセレ
![[作って学ぶ！jQuery] 第1回 セレクタを学ぶ | バシャログ。](https://cdn-ak-scissors.b.st-hatena.com/image/square/1f4390ea5b2b558adfd9c349b9a080aae407daff/height=288;version=1;width=512/https%3A%2F%2Fbashalog.c-brains.jp%2Fshared%2Fpublic%2Fimg%2Fcommon%2Ficon_ogp02.png)
CTOA日記:JQueryを使ってテーブルに行を追加する - livedoor Blog（ブログ）
2010年09月10日 JQueryを使ってテーブルに行を追加する JQueryを使ってテーブルに行を追加する場合は、tableに対してappendを使います。テーブルに行を追加するのはJQuery経由がシンプルだと思います。 $('#hoge_table').append('' + '<tr>' + '<td>aaa</td>' + '</tr>'); javascriptとJQueryは使う度に調べて、試してを繰り返している気がする。 「javascript」カテゴリの最新記事 タグ ： JQuery table
jQueryを用いた増殖フォームについて（および:hiddenセレクタの挙動に関する注意事項） - Collect note
HTMLでフォームを作る際、初めから必要個数が分かっている場合であれば、静的なHTMLファイル一枚用意すれば事は足りるが、ユーザ操作によって動的にフォームを増やせるようにしたい、といった場合には、JavaScriptによってHTMLをDOM操作して処理する必要がある。 そういった場合に、jQueryを用いることで、かなり容易に実装することが可能となる。 今回は、そのテストケースとしての実装例を挙げ、その挙動について考察をしてみる。 環境 今回の実装およびテストは以下の環境にて行った。 ライブラリ jQuery1.4.2 ブラウザ IE 6 Firefox 3.6.3 Safari 5 Google Chrome 5 単純なフォームの複製 copyボタンを押すことで、フォームのまとまり（ブロック）が複製されていくという単純な例を、以下の通りに実装した。 [test1.html] <html>
【jQuery】入力フォームを追加するサンプル - すたら日記
jQueryの.clone()メソッドで、入力フォーム一式をまるごとコピーするようにしています。 その後、idの通し番号のみを書き換えています。 デモhttps://codepen.io/sutara79/pen/mjLyWr 応用 追加したフォームを削除したい場合は、下記の記事をご覧ください。 http://d.hatena.ne.jp/sutara_lumpur/20111113/1321169720 より汎用的なjQueryプラグインを作りました。 jquery.addInputArea.js
jQuery 日本語リファレンス
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
jQuery UIで実現！ Ajaxで複数選択ドラッグ＆ドロップ
jQuery、プラグイン、jQuery UI、Web経由のCDNとは CSSの書き方も分かるjQueryプラグイン実践活用法（1） 基本／おさらいとしてプラグインやjQuery UIについて簡単に触れ、Web経由でjQueryを使うCDNについて解説 デザインハック ＜ リッチクライアント 2009/12/8 今回は「jQuery UI」のより進んだ活用例 ■ jQueryのプラグイン「jQuery UI」とは？ 今回紹介するjQuery UIは、JavaScript（Ajax）フレームワークjQueryのプロジェクトがjQuery用に開発している、以下の機能を提供するプラグインです。 ドラッグ＆ドロップなどのマウス操作の機能拡張 ユーザーインターフェイスを改善するウィジェット（アコーディオン、日付入力、ダイアログ、スライダー、タブなど） 今回は、jQuery UIのドラッグ＆ドロップ機能
jQueryでスクロールしても上に固定されるメニュー｜Webpark
よく見かけるタイプのjQueryを使ったスクロールしても上に固定されているメニューを紹介します。最近FC2ブログの上部に現れた検索バー（このブログは非表示にしてます）みたいな感じです。 <script type="text/javascript"> $(function() { $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop != 0) $('#nav').stop().animate({'opacity':'0.5'},400); //スクロール時 else $('#nav').stop().animate({'opacity':'1'},400); //一番上にあるとき }); $('#nav').hover( function (e) { var scrollTop =
jQuery入門
このページはAjaxライブラリの1つであるjQueryライブラリを勉強したい人向けに用意されています。 jQueryはバージョンによって記述方法が異なる場合があります。ここでは、バージョン別にページを用意するようにしてあります。 Ajaxライブラリで有名なものとしてはPrototypeライブラリやYahoo UI Libraryなどがあります。jQueryはPrototypeライブラリなどと併用することもできるようになっています。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 jQuery入門 (ver 1.2.1) jQuery入門 (ver 1.2.2) jQuery入門 (ver 1.2.3) jQuery入門 (ver 1.2.4) jQuery入門 (ver 1.2.5) jQuery入門 (ver 1.2.6) jQuery
第5回 jQuery UIによるユーザインターフェースの改良 | gihyo.jp
今回使用する「Dialog」「Draggables」「Droppables」「Sortables」に必要なファイルは以下の通りです。 themes/ jquery-1.2.3.min.js jquery.dimensions.js ui.mouse.js ui.resizable.js ui.dialog.js ui.draggable.js ui.draggable.ext.js ui.droppable.js ui.droppable.ext.js ui.sortable.ext.js ui.sortable.js jQuery UI 1.5bを使うために、今回は同梱されているjQuery 1.2.3を使うことにします。バージョンが上がりますが、これまでのサンプルの動作に影響はありません。 ライブラリの設定 ライブラリの各ファイルを、head要素の子要素に以下のように指定します（
[作って学ぶ！jQuery] 第0回 jQuery とは？ | バシャログ。
こんにちは、kimoto です。最近暑くなったり寒くなったりで落ち着かない気候ですが、みなさんいかがお過ごしでしょうか。 私は階段で転んで肩と二の腕を痛めました。気候関係ないですけど。 さて、今や JavaScript ライブラリと言えばコレ！と言うくらい人気のある jQuery 。 その jQuery にスポットを当てて短期集中連載をしていこうと思います。 実際に使えるサンプルを題材に、概要を学べる内容にしたいと思っています。 本日は第 0 回という事で、jQuery とは何か？という所から始めたいと思います。 jQuery とは、JavaScript ライブラリの一つで、現在もっとも人気のある JavaScript ライブラリだと言われています。 MIT License と GNU General Public License のデュアルライセンスで、フリーかつオープンソースです。 J
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
2/4 jQueryのセレクタ Forms 1 [Javascript] All About
はじめてのjQuery