div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」:phpspot開発日誌
Overview | jPList - jQuery Data Grid Controls div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」。 div、table、ulなどで列挙されたデータに、次のようなインタフェースを追加して、便利にしてくれるというもの。 既存のHTMLにソートやフィルタなどの機能拡張したい場合に使えそうです。 関連エントリ アイテムをクールにアニメーションしつつフィルタ・ソートが出来るjQueryプラグイン「MixItUp」 リストやテーブル、DIV等の要素を好みにJSでソートできるjQueryプラグイン「SortedList」 テーブルに検索、ソート、ページ分け機能をつけて便利にしてくれる「Dable」
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
プロジェクト管理に使ってみたい。jQuery製のガントチャートライブラリ·jQuery.ganttView MOONGIFT
jQuery.ganttViewはjQuery製のガントチャート表示ライブラリです。 jQueryを使ってガントチャートを表示するライブラリがjQuery.ganttViewです。表示だけでなくデータのメンテナンスもできるようになっています。 いい感じにガントチャートが表示されています。 ドラッグでタスクを左右に移動させられます。 期間の変更は枠の端をドラッグします。 データはJSONで与えるだけです。 jQuery.ganttViewは表示系のライブラリなのでデータベースに蓄積された内容をガントチャートにして表示すると言った使い方が便利そうです。なお表示はタスクごとに横に表示される形で、複数のタスクを同一線上に表示することはできないようです。 jQuery.ganttViewはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。 MOONGI
見た目がクールなグラフ描画用jQueryプラグイン「Morris.js」:phpspot開発日誌
Morris.js 見た目がクールなグラフ描画用jQueryプラグイン「Morris.js」。 マウス位置に応じて情報を変えるなど、GoogleAnalytics風のインタラクティブなグラフが描画できます。 実際には次のようなグラフが描画できます。IE6+でも動くということで、そこら辺の心配も無しです サンプルコードも載っていたりするので簡単に使えそうです グラフの種類は線グラフのみですが、多機能すぎて馬鹿でかいよりもシンプルなのが逆にいいかもしれませんね。 関連エントリ HTML5で綺麗でインタラクティブなグラフが描けるライブラリ「Flotr2」 様々な時系列グラフを描画できるJavaScriptライブラリ「Rickshaw」 様々なインタラクティブ要素のあるグラフが描画できるJSライブラリ「Elycharts」
jQuery Mobile、バージョン1.1と1.2が相次いで登場予定。ロードマップが明らかに
昨年、2011年11月に正式版「jQuery Mobile 1.0」が登場したばかりのjQuery Mobileのブログで、今後のロードマップが明らかにされました。 これから春が終わるまでに、バージョン1.0.1、1.1、1.2と続けざまに新しいリリースが登場する予定です。 1.1は1.0の最適化を進めたものに まず2週間以内にメンテナンスリリースのjQuery Mobile 1.0.1が登場予定。 続いて次期版となるjQuery Mobile 1.1では、以下の3つが主な改良点となります。 AMD Support: Dependency management, flexible builds and improved code structure. True fixed toolbars: Lightweight, CSS-based & broadly compatible. Impr
データを扱うテーブルなどにインクリメンタルサーチをjQueryを利用して実装する :: 5509
返ってくる結果が膨大になりがちな検索結果(特に管理画面など)などでは、そこからさらにデータを絞り込みを行いたい場合もあるかと思います。毎回ページの遷移があったのではユーザーの負担になりがちです。 そこでjQueryを利用してインクリメンタルサーチを実装する方法をメモもかねて紹介します。 サンプル サンプルファイルのダウンロード テーブルのデータでインクリメンタルサーチを行う 考え方 今回は「A B C D ….」のように単語を半スペースで区切ることを前提に考えます。 考え方は簡単で、 半スペースで区切られた単語を配列(value=[])に保存する。 まず最初の単語(value[0])が含まれているTDをmatchで検索する。 含んでいない場合は親のTRを非表示にする。 さらに2つ目以降の単語(value[1〜x])が存在すれば value[1]からvalue[x]までを順番にmatchで検
注目！サーバサイドからjQueryを使ってDOM操作·nodeQuery MOONGIFT
nodeQueryはnode.js用のサーバサイドjQueryで、サーバサイドでクライアントサイドのDOMを変更できたりします。 node.jsでjQueryライブラリを読み込むと、jQueryが提供するメソッドを使えますが、さらに一歩進めたのがnodeQueryです。サーバサイドからクライアントサイドの描画を変更できたりしてとても面白い実装ができます。 インストールはnpmで行います。 まずサンプルのブログです。普通に表示されているのが分かります。 サーバサイドです。node.jsのスクリプトの中でHTMLタグを出力しているのが分かります。構文にjQueryが使われているのも分かります。 ブログの新規投稿です。 投稿できました。 Twitter検索です。 時間が更新されるデモです。サーバサイドの時間であるのがミソです。 サーバサイドのソースです。 nodeQueryを使うとサーバサイドと
jQueryで手軽にサクッとシンプルなニュースティッカーを作る
今更なTipsなんですけど、まぁ自分用の 復習的な記事です。カスタマイズしやす いニュースティッカーを作るコードで、 1行でも4行でも画像でも、cssで見た目 をスタイルするだけで少量のコードで 実装する事が出来ます。 いろいろプラグインを紹介しておいてアレですけど、実際プラグインに依存すると困ることのほうが多いので簡単なものは簡単なコードで実装出来る程度にはしておきたい所ですね。 Sample:01ティッカーです。実際こんな風には実装せず、目立たないところに配置しますけど・・ 以下のコードで実装します。 function ticker(){ $('#news li:first').slideUp( function(){ $(this).appendTo($('#news')).slideDown(); }); } setInterval(function(){ticker()}, 50
良い感じで動作するニュースティッカー実装jQueryサンプル:phpspot開発日誌
Auto Scroll News Ticker with jQuery | rolling news,news ticker,text effect,text scroller 良い感じで動作するニュースティッカー実装jQueryサンプル。 ulリストでニュースを定義しておいて掲載されているコードを実装すれば小気味よくアニメーションしながら切り替わるニュースティッカーを実装できます。 １行ニュース ３行ニュースにも出来ます デモページはこちら うっとうしくないぐらいの動作がいいですね 関連エントリ 電光掲示板のようにニュースをクールにアニメーション表示できる「jquery vticker」 コンパクトでクールなニュース表示ウィジェット実装デモ＆サンプル
編集できるコンボボックスを実装するjQueryプラグイン「Editable Combo Box」:phpspot開発日誌
編集できるコンボボックスを実装するjQueryプラグイン「Editable Combo Box」 2011年09月09日- Editable Combo Box | jQuery Plugins 編集できるコンボボックスを実装するjQueryプラグイン「Editable Combo Box」。 HTML標準では編集できるコンボボックスというのは存在せず自分で作る必要がありますが、このjQueryプラグインを使えば、select 要素を .comboEditable() として初期化するだけで実装できます。 例） $(this).find('select').comboEditable(); 編集できる＆ドロップダウンから選択肢を選べます HTML的にも<select>の中に<option>として定義していけばいいため、JavaScriptの配列などを使わなくとも簡単に実装できます。 関連エ
これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」:phpspot開発日誌
これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」 2011年07月19日- jQuery EasyUI - help you build your web page easily これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」 Ext.jsばりに美しくてリッチなUIをjQueryでも実現できちゃいます。さらに、使い勝手がjQueryなので誰でも簡単に実装できちゃいます。Extはなんとなく取っ付きにくいと感じたかたも簡単に使えそう。 サイト上のチュートリアルやドキュメントも充実していて分かりやすいです。 リッチなものが作れるのはいいけど使い方が難しかったりメンテナンス大変だと、使う気が少し失せてしまいそうですがこれなら大丈夫かもしれません。 テーマやマルチリンガルにも対応しているらし
jQueyを使う場合に覚えておくと便利なChrome拡張:phpspot開発日誌
jQueyを使う場合に覚えておくと便利なChrome拡張が２つほどありましたのでご紹介。 マニュアルを検索する際にクイックに目的のものにアクセスし、開発スピードを上げられます。 jQuery API Browser ツールバーにボタンを追加してマニュアルをインクリメンタル検索。サンプルコードまでをChrome上で出せます。 インストールするとボタンが表示されます。 インクリメンタル検索が可能。 クリックすればサンプルコードも表示されます。 これは便利。 jQuery API Search 標準の検索窓に「jq ajax」などをタイプすればjqueryのマニュアル検索に飛べます Chrome上でインクリメンタルな検索が可能。 結果はjQueryのサイトにて閲覧 とりあえずどちらかいれておいて損はなさそうです。 関連エントリ PHPのエラーなんかをブラウザで確認できるChrome拡張「php-
jQueryやHTML5を使ってiPhoneやiPad向け電子書籍を作成する為のフレームワーク・Laker - かちびと.net
iPadや、iPhoneなどのタッチデバイス の普及で、個人的にも電子書籍への 関心がかなり高まりました。そんな中、 割と良さそうな電子書籍専用のフレーム ワークがあったのでメモがてらご紹介。 こういうの覚えておくと重宝しそうですね。 なかなか動きが良かったです。ただ読むだけの電子書籍ではなく、HTML5やjQueryを使って、より「電子」らしく表現出来ると楽しそうですね。 HTML5で作る電子書籍用のフレームワークです。jQueryやiPadのようなタッチデバイス向けのフレームワークとなっています。 複数フレームワークを併用 Lakerには定番のjQueryや、iPhone、iPadで黄金比を保つcssフレームワークのLess Framework、HTML5+jQuery製動画プレイヤーのjPlayer、スワイプイベントをサポートする為のライブラリ、TouchSwipeなども搭載されてい
アニメーションするスピードメーターを実装できるjQueryプラグイン「Speedometer」:phpspot開発日誌
Speedometer | Jacob King アニメーションするスピードメーターを実装できるjQueryプラグイン「Speedometer」。 何かが高いスピードが出ているのを示したいようなケースにすぐ実現できます。レアなケースかもしれませんが、サイトのスピードが速くなったとか、なんらかのスピードが高まったのを分かりやすく伝えたいような場合に使えそう。 あんまり使わないかもしれないけれど、レアなパーツなんかをまとめておくと便利かもしれませんね 関連エントリ jQuery用データビジュアライズ用プラグイン「jQuery Visualize Plugin」
モバイルアプリケーション開発のためのHTML/CSS/JavaScript関連技術まとめ
モバイルアプリケーションをHTML/CSS/JavaScriptなどのWeb標準技術を用いて開発するためのさまざまなツールや環境が登場しています。1つ前の記事で紹介した「jQuery Mobile」もその1つですが、それ以外のものもここでまとめて紹介しましょう。 jQuery Mobile jQuery Mobileは、JavaScriptライブラリとして知られるjQueryのプラグインです。オープンソースで提供されています。 「マークアップドリブン」をコンセプトとし、HTMLを記述していくことで、あらかじめ用意されているボタン、メニュー、ダイアログボックス、などのモバイル対応のタッチユーザーインターフェイスを備えたアプリケーションを開発できます。 クロスプラットフォームに対応し、iOS、Android、WebOS、Windows Phone、Symbianなど多数のデバイスでそのまま動作
「jQuery Mobile」の登場で、モバイルアプリケーション開発は大きく変わる － Publickey
このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！ スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である 具体的な
ローソク足を表示するjQueryプラグイン「jqCandleChart」 - uraitoのいまだにブログ名が未定のブログ
作ったのはだいぶ前な気がしますが、jqCandleChartというjQueryプラグインを書いたので紹介します。 何をするもの？ 使い方 1) プラグインの読み込みとHTMLの準備 ソースをgithubのリポジトリからダウンロードし、その他jQueryのプラグインと同様に読み込んでください。表示にはjquery.candlechart.jsのみ利用します。その他のファイルは説明やテスト用ですので不要です。 <script src="jquery.js" type="text/javascript"></script> <script src="jquery.candlechart.js" type="text/javascript"></script> また、描画用のcanvasをHTML上に準備します。 <canvas width="400" height="300" id="cv01"
サーバサイドJavaScriptとjQueryでスクレイピング
jQuery でスクレイピングできたらセレクタ使えるし便利かなーと思ったりしたんですが、Rhino と env-js を使うと超簡単にできたのでレポートしてみます。 Rhino と env-js って何ぞい？ Rhino ってのは Java で書かれた JavaScript エンジンです。Rhino を使うとコマンドラインから JavaScript を実行できます。 Rhino には DOM が無いので単体では jQuery を実行することはできませんが、env-js という DOM ライブラリを使用するとこの辺はクリアできます。 env-js の中に jQuery を使ったサンプルがいくつか入ってますので、Java とか JavaScript とか詳しい方はそちらを見てもらった方が早いと思います。 使ってみる まず env-js をビルドしないといけないのでその辺の手順から説明します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQueryだけでURLをパースするプラグイン「jQuery-URL-Parser」 | Web活メモ帳
