タグ

jQueryに関するchorinskyのブックマーク (33)

  • jQuery Menu: Dropdown, iPod Drilldown, ...

    jQuery Menu: Dropdown, iPod Drilldown, and Flyout styles with ARIA Support and ThemeRoller Ready Update: We contributed this menu plugin to the jQuery UI library. It’s currently being refactored and slated for upcoming release. You can track its progress at the jQuery UI Planning Wiki (Menu planning page), or better, post feedback or share your own ideas about the jQuery UI planning process by joi

    jQuery Menu: Dropdown, iPod Drilldown, ...
  • UIプロトタイプ:autocomplete (jQuery plug-in jSuggest)

    昨日に引き続いて、今日も作成中の Google App Engine アプリ用のUI部品の作成。HTMLの一部に記述された(もしくは別途JSONで取得した)ワード・リストの入力を autocomplete を使って簡単にしようという試み(Google Suggestのようにダイナミックにリストを取得する必要はない)。 そこで、まずは既存のライブラリ・プラグインの調査から。必要とする人も多いようで、少し調べただけで20個ぐらい見つかる。デモを見て5つに絞ってからそれぞれのソースコードを解析。例によってどうしようもない品質のコードもあるので、結局のところたどり着いたのは、比較的コードがきれいなこの二つ。 jQuery Autocomplete Mod JQuery Plugins by Dylan Verheul - autocomplete どちらかをそのまま使っても良かったのだが、どちらも

  • 『Googleサジェストが実装できるjQuery Autocomplete Mod』

    jQuery Autocomplete Mod はjQueryベースのプラグインで、テキストボックスに入力した情報を元に、Googleサジェストのような機能を簡単に実現することができます。 Ajaxを使って外部プログラムと通信しながら情報を取得し、候補をユーザーに表示することができるほか、予めJavaScript内に定義していた情報から入力された情報を補完するというような使い方もできます。 設置方法は、jQuery Autocomplete Mod のサイトから、下記3つのファイルをダウンロードします。 ・ jquery.autocomplete.js 体となるJavaScript ・ jquery.autocomplete.css 検索結果のフォームを表示するためのCSS ・ indicator.gif サイト上ではリンクが掲載されていないのですが、検索候補のローディング時に表示する画

    『Googleサジェストが実装できるjQuery Autocomplete Mod』
  • jQuery+CSSで実装するナビゲーションメニュー総集編 - かちびと.net

    jQueryを使用したcssナビゲーション メニューのまとめです。フェードや スライド、滑らかにドロップダウンする、 などなど色々なメニューをまとめました。 それほど多用はしませんが、必要な 時に探すのが面倒なので備忘録的に。 という訳で、個人的なjQuery+cssメニューの総集編です。 全部で73個。複数ブラウザでの確認はしていません。順不同です。少し重いかも・・ Large Drop Down Menu スライド&ドロップダウンメニュー Search Box with Filter and Large Drop Down Menu Fly-out Menu with jQuery and CSS3 カッコいいですねー。反対側からスライドするフライアウトメニュー。css3を使っています。 Fly-out Menu with jQuery and CSS3 Rocking and Rol

  • jQuery1.3 リリースノート - jQuery 日本語リファレンス

    2009年1月14日に、jQuery 1.3がリリースされました。 主な変更点を、以下に挙げます。 概要 セレクターエンジンをSizzleに変更 jQueryのCSSセレクターエンジンが、Sizzleと呼ばれる新たなものに変更されました。 このエンジンはjQueryの生みの親であるJohn Resig氏が別に進めていたプロジェクトで、他のJavascriptライブラリでも利用されるように汎用的な設計がされています。以前よりjQueryのエンジンをこれに差し替えるモジュールは公開されていましたが、今回ついに正式に差し換わることになったようです。 Sizzleの目指す姿が、次のように端的に語られています。 最速拡張可能スタンドアロン このうち、最初に挙げた「最速」については、特に使用頻度の高い書式についてこだわっています。CSS3にも対応し、かなりマニアックな記述もできるようになっていますが、

  • jQueryでDOM構築後に追加された要素にイベント登録する | カテゴリー: Javascript | 作業メモ

    live(type, fn) スクリプトで動的に追加した要素でイベントが効かない時に使える。 以下の制限があるものの、後で追加した要素にイベントを登録できる。 この関数で指定できるイベントは、次の通りです: click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress, keyup $(function(){ $("p").live("click", function() { alert('test'); }); });

  • Bugle Diary: [jQuery]$(func)でready(fn)みたいな動作

    びっくりしたのですが、前回、ready(fn)でonload処理を・・・でjQueryを使ってonloadのような処理する方法を書いたのですが、もっと簡単な方法があったようです。 <!DOCTYPE html> <html> <head> <script src="jquery-1.4.2.min.js" type="text/javascript" charset="UTF-8"></script> <title>jQuery</title> </head> <body> <script type="text/javascript"> $(function(){ console.log("整いました。") }) </script> </body> </html>

  • anything from here jQuery()の挙動を解読する(21) $(document).ready(f)、bindReady()、$.ready() 解読 ──jQuery解読(32)

    $(document).ready(fn) - bindReady() - $.ready() $(document).ready(fn) が bindReady() を、そしてそこから $.ready() が呼び出される三層構造で、これらのメソッドが機能します。 それぞれの役割は、順に以下のようになります。 $(document).ready(fn)……(1/2) DOM読み込み完了通知イベントの登録( bindReady()メソッドの実行 ) $(document).ready(fn)……(2/2) DOM 読み込み完了時の fn の実行と DOM 読み込み完了時に実行させる関数の登録、 bindReady()……(2) DOM 読み込み完了のチェックと完了時の jQuery.ready()呼び出し jQuery.ready()……(3) DOM 読み込み完了を記録するプロパティの設定

  • jQueryでthisの子要素を取得するやり方いろいろ | Base Views

    公開 2010年6月6日(日) 更新日 2014年8月18日(月) スポンサーリンク jQueryを使っていて、thisとその子要素を同時に指定したい場合がある。 結構いろんなやり方があるみたいで、取りあえず使いやすそうなので下の3通り。 $("hoge",this) $(this).children("hoge") $(this).find("hoge") 一番上がシンプルでいいかと思うんですが、取得したいthis直下の要素名をthisの手前に書くんですね… 使いどころは多そうですが、例えば下みたいなの。「Click1」をクリックしたらその直下の<div>が隠れるようにしたい場合とか。 <ul> <li>Click1 <div> <h2>Menu1</h2> <p>text1</p> </div> </li> <li>Click2 <div> <li>Menu2</li> <li>tex

    chorinsky
    chorinsky 2010/12/23
    まさに知りたい内容でした。ありがとうございます
  • JQueryを使ったスライド表現を集めた「10 Best jQuery Sliders」

    一枚のページにたくさんの情報をまとめたい時に便利なのがスライド表現。今日紹介する「10 Best jQuery Sliders」はコンパクトで高機能なAjaxライブラリjQueryを使って実装するスライド機能を紹介するエントリーです。 loopedSlider いくつかのスライド表現のサンプルが公開されていますが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。 詳しくは以下 ■Easy Slider 様々なタイプのスライドを制御できるスライド表現。用途に応じて使い分けができそうです。 ■ Introducing Coda-Slider スタンダードなタイプのスライダー。応用が利きそうなつくりになっています。サンプルをダウンロード可能。 ■CrossSlide – A jQuery plugin to create pan and cross-fade ani

    JQueryを使ったスライド表現を集めた「10 Best jQuery Sliders」
  • selectボックスをシンプルなプルダウンに拡張するjQselectable(jQuery.selectable.js) :: 5509

    セレクトボックスのユーザビリティを劇的に向上できるかもしれないjQueryプラグインです。バージョンアップでjQuery.selectable.jsからjQselectableに名前が変わりました。 サンプルを見てみる トピックス 特徴 ダウンロード 導入方法 スタイル 拡張 表示形式 selectable simpleBox エフェクト 透明度 プルダウン位置の調整(少し高度な設定) プルダウンの高さ カスタマイズ 独自のselectボックスに適用させる id、classの引継ぎ 日付で使う Callback関数を使う 動的にselect要素のDOMを書き換える場合(rebuildメソッド) サンプル 更新履歴・追記 動作環境 特徴 selectボックスの選択ってイライラしないですか?jQselectabeを使えば解決できるかもしれません。以下が主な特徴になります。 セレクトボックスの

  • はじめてのjQuery

    デザイナ向け「初めてのjQuery」

  • 40分で覚える!jQuery速習講座 (1/6)

    いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは? そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目:導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー体(JavaScriptファイル)は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。

    40分で覚える!jQuery速習講座 (1/6)