タグ

jqueryに関するblmk313のブックマーク (15)

  • プロジェクト管理に使ってみたい。jQuery製のガントチャートライブラリ·jQuery.ganttView MOONGIFT

    jQuery.ganttViewはjQuery製のガントチャート表示ライブラリです。 jQueryを使ってガントチャートを表示するライブラリがjQuery.ganttViewです。表示だけでなくデータのメンテナンスもできるようになっています。 いい感じにガントチャートが表示されています。 ドラッグでタスクを左右に移動させられます。 期間の変更は枠の端をドラッグします。 データはJSONで与えるだけです。 jQuery.ganttViewは表示系のライブラリなのでデータベースに蓄積された内容をガントチャートにして表示すると言った使い方が便利そうです。なお表示はタスクごとに横に表示される形で、複数のタスクを同一線上に表示することはできないようです。 jQuery.ganttViewはjQuery/JavaScript製のオープンソース・ソフトウェア(MIT License)です。 MOONGI

  • jQueryでスクロールすると上部に固定されるナビゲーション

    Posted: 2012.02.21 / Category: javascript / Tag: jQuery グローバルナビゲーションはロゴの下に配置されていることが多いですが、スクロールするとナビゲーション部分だけが上部に固定されるようなものをjQueryでやってみたいと思います。 html & css htmlです。 html <h1><a href="#">タイトル</a></h1> <div class="nav"> <ul class="clearfix"> <li><a href="#">HOME</a></li> <li><a href="#">ABOUT</a></li> <li><a href="#">NEWS</a></li> <li><a href="#">LINK</a></li> </ul> <!-- /#nav --></div> <div id="artic

    jQueryでスクロールすると上部に固定されるナビゲーション
  • Webサイトのレイアウト調整や補助に使えるjQueryプラグインいろいろ

    レイアウトの調整を簡略化したり、通常 は難しいレイアウトを可能にしたり、とい った補助的なjQueryプラグインのまとめ です。最近探す機会が増えたので今後 の為に備忘録的に記事にしておきます。 この手のプラグインは数多にあるので 好みで端折っています。 レイアウトの調整や補助などに使えるjQueryプラグインのまとめ。と、言っても大抵は既出だと思います。順不同。 Supersized 画面に合わせて自動的に背景画像を伸縮してくれるだけでなく、スライドショーにもなってくれます。いつか仕事で使いたい。最近FlickrAPIにも対応しました。 Supersized jQuery UI.Layout Plug-in ブラウザごとの差異を考えずに自由にレイアウトを組めます。 jQuery UI.Layout Plug-in JQUERY CUSTOM CONTENT SCROLLER スクロール

    Webサイトのレイアウト調整や補助に使えるjQueryプラグインいろいろ
  • jRumble | A jQuery Plugin That Rumbles Elements

    Latest Version: 1.3 Latest Release Date: December 3, 2011 Original Release Date: March 30, 2011 Compressed: 1.47kb Uncompressed: 4.84kb View GitHub Repository About The Plugin jRumble is a jQuery plugin that rumbles, vibrates, shakes, and rotates any element you choose. It's great to use as a hover effect or a way to direct attention to an element. 2016-11-04 Update This project is no longer being

    jRumble | A jQuery Plugin That Rumbles Elements
  • 社内講習わくわくjQuery編1 - jQueryを使ってみよう

    今回の目標 読める+書ける=学べる 2時間ちょっとでいきなり書けるようになる訳はありませんが,書いてみないと覚えられないので,2時間かけて触ってみて独学できるようにします. 最初に,1+1=2の原理を覚える必要はないので,2=1+1でも 2=2*1 でも 2=1/2*4 でもいいので,やりたいことをやってみるのが一番です. やること jQueryセレクタをつかってみよう 要素をブン回してみよう スライドショーの動きを追ってみよう 開閉メニューの動きを追ってみよう やらないこと プログラムの基(習うより慣れる) JavaScriptの構文(書きながら覚える) jQueryPluginの使い方(オプションをいじる以上のことをやろうと思うと難しい) thisなんてしりません $.eachなんてしりません 変数とかIFなんてわかりません jQueryを使えるようにする Downloading j

    社内講習わくわくjQuery編1 - jQueryを使ってみよう
  • [JS]jQueryのプラグイン100選 -2010年総集編

    2010年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年は、アニメーションのエフェクトやレイアウト、後半は背景画像関連のプラグインが特に目立っていたように思います。 [ad#ad-2] コンテンツスライダー・カルーセル関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 ツールチップ関連 レイアウト関連 背景画像関連 その他UI関連 アニメーション関連 スクロール・ドラッグなど操作関連 テーブル・リスト・データ関連 フォーム関連 コンテンツ生成 その他 コンテンツスライダー・カルーセル関連

  • ソートが無駄にアニメーションしてカッコいいテーブル実装jQueryプラグイン:phpspot開発日誌

    MITYA.CO.UK | Scripts | Animated table sort (REGEXP friendly) ソートが無駄にアニメーションしてカッコいいテーブル実装jQueryプラグイン。 どこからどこに移動するというのが目視で確認できるので、無駄に、というのは言い過ぎかもで便利かもしれません。 テーブルの内容が、「ほげほげ(111)」のような文字を含む値であっても、正規表現で数値をマッチさせることでソートするなんて機能もあるみたいです。 比較テーブルなんかで使うと分かりやすい比較のUIが作れそうです。 関連エントリ jQueryベースの多機能グリッドテーブル「DataTables」 CSV形式のデータを簡単にテーブルに出来るjQueryプラグイン「csvtotable」 ドロップダウンメニューにテーブルやフォーム等何でも埋め込んでしまえるjQueryプラグイン「MegaMe

  • FlashとjQuery どちらで実装するか決める際の重要なファクター

    ウェブサイトを構築する際、FlashとjQueryは非常に魅力的なツールです。コンテンツを実装する際にどちらを使用すべきか迷うこともあると思います。 両方の特徴を把握し、実装する際に適切に選択するための重要なファクターを紹介します。 A Closer Look at Choosing Between Flash and jQuery 下記は各ポイントを意訳したものです。 はじめに 1. FlashとjQuery どちらにするか重要なファクター 2. jQueryとFlashサイトのショーケース まとめ はじめに HTML5の登場により、それがFlashを破るか否かに関わらずこれらはウェブコミュニティで議論の的でした。この議論が活発に行われる中、Flash vs. JavaScriptの話題は少し失われていました。 ここではJavaScriptの中から特に人気の高い「jQuery」をとりあげ

  • どんなフォームにも使えるjQueryのフォームバリデーション exValidation :: 5509

    jquery.validation.jsというフォームバリデーションプラグインを公開していますが、使える場面が割と限定されてしまうような作りだったので、より幅広く使えるようにexValidationという名前で新しいjQueryプラグインとして作り直しました。伴って仕様や使い方が異なる部分も多いので、ドキュメントとして書いておきます。ただし前半のバリデーションルール周りは同じエンジンを使ってるので、ほぼ同じです。ちなみにすごい長いです。。 ルールを割り当てる際のclass名がhogeからchkhogeに代わりました。アップデートして使う場合は注意してください。 サンプル1: エラーを右上に表示 サンプル2: エラーを下に表示 トピックス ダウンロード 使い方 1. JSファイルを読み込む 2. 基バリデーションルール 3. select, checkbox、radio、複数項目の場合 4

  • jQueryの日本語の解説サイトと国産のプラグイン集

    MopBox 複数パネル(デモには100以上のパネルも)の表示にも対応した、画像・Flash・動画などを表示できるドラッグ移動可能なボックス。

  • 入力最大値に達したら自動で次の要素に移動させられるjQueryプラグイン「Autotabindex」:phpspot開発日誌

    入力最大値に達したら自動で次の要素に移動させられるjQueryプラグイン「Autotabindex」 2010年05月24日- Autotabindex Example 入力最大値に達したら自動で次の要素に移動させられるjQueryプラグイン「Autotabindex」。 例えば、携帯番号を入力する場合など、一定の文字数以上になった場合に、TABキーを押すなどせずとも、次のフィールドにカーソルを合わせることができます。 TABキーを知らないライトユーザーな方々はマウスでいちいち移動していたりもしますが、このプラグインでユーザビリティを上げられそうです。 JavaScript で1から実装するとなると、少し面倒な上に、要素ごとにonkeydownを入れたりしてコードが汚くなったりしますが、jQueryプラグインなので1行で次のように初期化できます。 $(document).ready(fun

  • フォーム要素にうっすらデフォルト値を入れてヒント表示できる「jQuery Form Tips」:phpspot開発日誌

    PHPからTwitterを簡単に操作できるPEARパッケージ「Services_Twitter」がアッ... 次の記事 ≫:PHP関数の挙動をちょっと調べたいときに助かる「PHP Functions Online」 jQuery Form Tips Plugin フォーム要素にうっすらデフォルト値を入れてヒント表示できる「jQuery Form Tips」 フォームにデフォルト値を入れておくことで利用者が何をいれていいのか、というのが直感的にわかり、かつスペースもとらないのでよく使われる手法ですが、実装も超簡単にやりたいですね。 jQuery Form Tips を使えば、フォーム要素の title 属性に値を入れておくだけでヒントを自動表示できます。 <p> <label for="i1">Field1</label><br /> <input type="text" name="i1"

  • jQuery TOOLS - The UI library for the Web

    Demo Area A small list of things you can do with this library. 1. Tabs The most important UI widget on the web Minimal setup for tabs Naming the tabs 3 different skins with CSS Loading tab contents with AJAX Handling browsers back button AJAX:ed tabs with History support Using mouseover to switch tabs Making Wizards with the Tabs Making Accordions with the Tabs Customizing the Accordion e

  • Aptanaで始めるJavaScriptライブラリ「jQuery」超入門

    JavaScriptライブラリ「jQuery」とは? 最近、Flashの代わりにJavaScriptを利用してリッチなデザインのWebサイトを構築する事例が増えてきました。特にグーグルのサービスは、JavaScriptをうまく取り入れている例として誰もがご存じでしょう。 例えばGoogleマップは、Webブラウザ上でマウスをドラッグ&ドロップするだけで、地図を自由に操作できます。このような操作感は、まるでWebサイトであることを意識させない作りになっています。 来、JavaScript自体はインターネットが広まり始めたころから存在していて、決して目新しい技術ではないのですが、Webブラウザの種類やバージョンによって挙動が異なることから、JavaScriptを使って大掛かりな仕組みを作ることは不可能だと考えられてきました。 しかし、最近ではWebブラウザは自動的にバージョンアップされるよう

    Aptanaで始めるJavaScriptライブラリ「jQuery」超入門
  • [JS]オルトを利用して、画像にキャプションをかっこよく表示するスクリプト -Captify

    画像のオルトを利用して、画像の上にオーバーレイでキャプションを表示するスクリプト「Captify」を紹介します。 Captify demo デモでは、画像にマウスオーバーすると、下側からキャプションがスライドしてオーバーレイで表示されます。 オプションでは、キャプションの表示位置(上・下)、表示のスピード、不透明度、表示方法(フェード・スライド・常設)、クラス名などが変更できます。 キャプションはデザインを適用したものを表示することも可能で、下記のようにdiv要素を使用することもできます。

  • 1