紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 videoBG 動画をページの背景(あずきの水玉)でもdiv要素の背景(暗いトンネル)でも配置します。 Superslides フル
GridはHTMLテーブルにソートやヘッダ固定、行選択と言った機能を追加するJavaScriptライブラリです。 業務システムを作っていると必ず発生するのがテーブルでの一覧表です。WebでExcelレベルのことは実現できませんが、リッチな表としてGridを使ってみるのは良さそうです。 デモです。 必要な場所だけチェックしてハイライトできます。 横スクロールしても左側の列はそのままです。 数値のオーダーも適切に動きます。 縦スクロールしてもヘッダー部はそのままです。 カラム幅の変更もできます。 GridはIE7以上、Google Chrome/Firefox/Safari/Operaに対応しています。jQueryやMootoolsと一緒に使うこともできます。機能はヘッダー、フッター、カラムの固定化やカラムのリサイズ、カラムのソート、行の選択などになります。データフォーマットはJSONの他、X
軽めのjQuery Advent Calendar 2012 – 01日目 jQueryってあるじゃないですか。便利ですよね。いろんなところで紹介されてるっていうかもう普通に使われてると思うんですけど。 jQuery() APIについてはこちら。 jQuery() – jQuery API jQuery(expression, context) – jQuery 日本語リファレンス jQuery(html, [ownerDocument]) – jQuery 日本語リファレンス jQuery(callback) – jQuery 日本語リファレンス jQuery(elements) – jQuery 日本語リファレンス jQueryと$は同じものなので、jQuery()と$()は同じです。これ、実は関数なんですよ。 というわけで、以下使い方。 5種類の使い方 セレクター : $('#tar
DOBON.NET DOBON.NET プログラミング道 .NET Tips 最近8日間の人気の20件ぱたうさ ( 159 / 138 / 44871 ) DOBON.NET/icon ( 92 / 143 / 13351 ) ShareButton ( 68 / 8 / 37886 ) PukiWiki/Tips/指定したページのソース(Wikiテキスト)を表示する ( 68 / 51 / 6116 ) Links ( 49 / 43 / 29891 ) .NETプログラミング研究/93 ( 44 / 30 / 150570 ) .NETプログラミング研究/112 ( 42 / 31 / 43925 ) free/kanaxsCSharp ( 38 / 29 / 35638 ) 自由区/DOBON.NETへの提案 ( 36 / 48 / 25636 ) ShareButton/AddTh
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 table要素をレスポンシブに対応させる、というスクリプトです。他にも同じようなスクリプトは存在しますが実用的ではなかったので紹介してなかったですけどこれはアリな気がします。 table要素をレスポンシブに対応させるjQueryプラグインです。他にもMediaTableやzurbのスクリプトもあります。 ウィンドウサイズの幅が狭くなると、表示しきれないカラム部分をタップによる表示式に切り替える、というもの。 上記のようにタップすると非表示部分のカラムの内容が表示されます。ユーザーにとっても分かりやすい気がしました。 公式の動作サンプルです Sample コード <script src="http://ajax.googleapis.com/ajax/libs/jqu
<html> <head> <title>TAG index Webサイト</title> <script type="text/javascript"> <!-- function check(){ var flag = 0; // 設定開始(チェックする項目を設定してください) if(document.form1.post1.value.match(/[^0-9]+/)){ flag = 1; } else if(document.form1.post2.value.match(/[^0-9]+/)){ flag = 1; } // 設定終了 if(flag){ window.alert('数字以外が入力されています'); // 数字以外が入力された場合は警告ダイアログを表示 return false; // 送信を中止 } else{ return true; // 送信を実行 }
jQueryのセレクタを用いることで、非常に簡単に記述する事ができます。 参考 jQueryのセレクタについては、次のサイトで網羅的に紹介されています。 jQuery – いろんなセレクタ指定方法+αを覚えて、目的の要素をさくっと取得する | 1:n – DETELU Blog
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 JSだけで作れるショッピングカート システム・simpleCart(js)のご紹介。 作れる、と書いてますけどまだ触って 無いです。便利そうだったので備忘録 的に記事にして見ます。簡単なもの ならこういうライトなもので済ませ たいですね・・ 時間が無くてデモを少し触っただけなのでセキュリティ面での安全性なんかは未確認です。OSSですが利用前にご自身でチェックして下さい。 JS製のショッピングカート。Mootools、jQuery、またはPrototypeに依存するライブラリです。JS+localStorageで作ってるっぽいです。ライトに使えて良さそうですね。※安全なら チェックアウトはPaypalやGoogleチェックアウトに対応しています。ソースをチラッと見たら
AJAX Libraries API - Google Codelというのが公開されていました。 jQUeryやMootoolsなどの人気のJavaScriptライブラリを Googleのサーバーから直接読み込んで利用できるというものらしいです。 わざわざダウンロードしてサーバーにアップロードして・・・ といったような手間が省けるようなので、 試しにつかってみることにした。 今回利用できるようになったライブラリは以下の5つ。 ・jQuery ・prototype ・script.aculo.us ・MooTools ・dojo これらが有名なライブラリなのですね。 そしてこのAJAX Libraries APIを利用すると、 こんな利点があるようです。 ・Google CDNを活用したファイルの配布 ・対応していればGzip圧縮転送を有効にする ・ダウンロードするファイルは可能なかぎり最小
We’re getting things ready Loading your experience… This won’t take long.
JavaScriptプログラミングのTOPへ input や textarea などのテキストボックスをフォーカスした際に表示される,「|」の形をしたカーソルの事をキャレットという。 また,Shiftキーを押しながらキャレットを移動させると,文字列が選択状態になる。 キャレットや選択文字列の情報は,JavaScriptで取得・設定できる。 下記は,IEで・・・ カーソル(キャレット)の位置を 取得する方法。 設定する方法。つまり,カーソルの移動。 選択状態になった文字列の範囲を 取得する方法。 設定する方法。つまり,指定した範囲を選択する。 のサンプルコード。 また,これらを応用して テキストボックスで,クリックした文字を取得する方法 についても述べる。 (1)IEで,カーソル位置を取得するサンプル (2)IEで,カーソル位置を設定するサンプル (3)IEで,選択範囲の取得をするサンプル
現在フォーカス(focus)しているテキストフォームのidと値を取得するコード(JavaScript)を教えてもらえれば幸いです。
Morphic.jsはWeb上に部品を配置して自由にデザインを決められるWebアプリケーションです。 ちょっと不思議なWebアプリケーションの紹介です。Morphic.jsはWeb上に独自のコンポーネントを配置できるWebアプリケーションです。モックアップを作ったり、ドローアプリケーション的に使えそうです。 トップページです。右クリックでメニューが出ます。 ドラッグして動かしたりできます。 ボックスを追加しました。 さらにスライダーやフレームを追加しました。 モバイルモードにするとメニューが大きくなります。 色設定もあります。 複数のmorphic.jsを埋め込めます。 Morphic.jsでは右クリックから部品を配置して、それを動かしたりリサイズしたりできます。ラベルを描画してフォントサイズを変更し、Webサイトのワイヤーフレームを作ったりすることもできるでしょう。いろいろな使い道が考え
そんな訳で、現状イマイチ扱いに困るCSS3アニメーションについて学習した内容をまとめておくとします。 はじめに - CSS3のアニメーション機能 ひと口にCSS3アニメーションと言っても、その実装方法は以下の二種類に大きく分類されます。 Transition Animation Transitionは対象となる要素の始点と終点の状態をそれぞれ定義し、その二点間をスムーズに変化させることでアニメーションを実現させるという仕組みです。 対するAnimationは始点と終点だけでなく、二点間の任意のタイミングにキーフレームを配置してその時点ごとの状態をそれぞれ指定し、よりダイナミックなアニメーションを実現させることが出来る仕組みです。 両者似ているようで異なる機能ですが、この仕組みを混同せずにキチンと押さえておけば、これといって泥沼にハマることなく習得することが出来ます(たぶん)。 今回はTra
目次 文字列 エスケープ文字 ダブルクォートとシングルクォート テンプレートリテラル テンプレートリテラル タグ付きテンプレート String.raw マルチライン 文字列オブジェクト string = new String(string) 文字列への変換 string = String(value) 文字列の長さ string.length 文字列の部分取り出し string.charAt(n) string.at(n) string.substring(from [, to]) string.slice(from [, to]) string.substr(from [, len]) string.trim() string.trimStart() string.trimEnd() 文字列の分割と連結 string.split([sep [, limit]]) string.conca
最終更新: 2018年8月2日 目次 結論 実験 実験結果一覧表 古いブラウザでの実験結果 結論 以下のように求められます。 ※ IE6, 7, 8は対象外です。 1. 表示領域の幅 (スクロールバー含まず) = document.documentElement.clientWidth; $(window).width(); // jQuery 2. 表示領域の高さ (スクロールバー含まず) = document.documentElement.clientHeight; $(window).height(); // jQuery 3. 表示領域左上のX座標 (文書左端から表示領域左端までの距離) = window.pageXOffset; window.scrollX; // pageXOffsetと同等(エイリアス) $(window).scrollLeft(); // jQuery
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く