jQuery の on() と off() を理解する - tacamy--blog
初心者向けの本とかだと、イベントを jQuery オブジェクトの後に直接指定する、 $('.foo').click(); のような書き方で説明されている場合が多いけど、少し複雑なことをしようとするとそれだと困ることが出てきます。そんなときに便利なのが on() を使ったイベント設定です。 on() ひとつで bind() live() delegate() を表せる jQuery 1.7 で、bind() live() delegate() がすべて on() に統合されたそうです。 つまり on() の書き方によって、3 パターンの使い方ができるということです。 .foo という要素をクリックしたら何かするという例で、イベントの設定と削除の方法をそれぞれ書いてみます。 bind() $('.foo').bind('click', function(){...}); は $('.foo')
IxEdit
IxEdit - The First On-the-Fly Interaction Design Tool for the Web. IxEdit (Public Beta) フリーダウンロード IxEdit は JavaScript ベースのウェブ用インタラクションデザインツールです。IxEdit を使えば、デザイナーはコーディング無しで DOM スクリプティングを実践し、ウェブページ上の要素をダイナミックに変更したり、追加したり、動かしたり、変形させたりすることができます。特に、IxEdit はウェブアプリケーションのプロトタイピング段階において様々なインタラクションを即座に作って試してみるのに役立つでしょう。 インタラクションとは？ インタラクションとは、ユーザーのアクションに応じてスクリーンの状態が変化することです。つまり、ユーザーインターフェースの振る舞いと言ってもよいでしょう。
[CSS]CSS3の美しいエフェクトを備えたナビゲーション -Circle Navigation Effect
デモページ 写真画像の下の半透明のパネルには画像の説明文とナビゲーション（アローとテキスト）が配置されており、ホバーするとサークル状にアニメーションで拡大しながらサムネイル画像に変わります。 2枚目の画像 [ad#ad-2] 実装 画像ギャラリー自体はjQueryをベースに作られており、ここではナビゲーションのエフェクトの実装方法を紹介します。 HTML ナビゲーション箇所はテキストと画像をa要素で内包します。 <div class="cn-nav"> <a href="#" class="cn-nav-prev"> <span>Previous</span> <div style="background-image:url(../images/thumbs/1.jpg);"></div> </a> <a href="#" class="cn-nav-next"> <span>Next</
覚えておくと地味に便利だと思える日が来るかもしれないjQueryのコードスニペット何個か - かちびと.net
これならjQueryじゃなくてもいいんじゃ 無いか、っていう記事です。短くて使い やすいスニペットなんですが、まぁ用途 は人それぞれだと思うので適当に流して 下さい。自分が使いやすいようにまとめ たいだけです。 そのコードおかしいわーみたいなのあったらすいません。まぁその程度の記事です。というわけでいろいろとツッコミどころ満載かもですが、あんまり気にしないで下さい。じゃあ記事書くなよって話ですけどｗ デモの見方 jsfiddleというサービスを好んでよく使うのですが、あまり見慣れないかもなので一応デモの見方を。上図の○で囲った部分、Resultを押せばデモ画面に、再生ボタンでリロードします。 簡単なコードなので実践で使うにはもう少し工夫が必要です。また、jQueryの勉強にもなるかもしれません。jsfiddleはフォークできるので宜しければ改善や動作の勉強等にご利用下さい。 こういうスニペ
全体をドラッグで動かせるグリッドレイアウトのイメージギャラリーをjQueryで構築するチュートリアル - かちびと.net
画面いっぱいに広がったグリッドレイアウト のイメージギャラリーをドラッグで動かす 事ができるコンテンツをjQueryで実装する 為のチュートリアルです。かなり良く出来 てます。iPhoneでも一応可能でしたので 工夫すればスマートフォンにも使えるかも。 Codropsのチュートリアルが相変わらず素敵なのでメモがてら。画面全体に広がったグリッドレイアウトのイメージギャラリーを丸ごとドラッグで動かせるようにする、というチュートリアル。 Draggable Image Boxes Grid 画面全体にギャラリーが広がり、全体をドラッグで動かせます。これは、Stephen HamiltonのWebサイトをオマージュしたもの。Stephen HamiltonはFlashですが、同じようなUIをjQueryで作ろう、という趣旨みたいです。ドラッグにはjQuery.kineticを使用しています。 サム
jQuery Mobileの紹介 | Lab by engineering@dwango.jp
今回は、jQuery Mobileを用いたアプリケーションについて解説します。jQuery Mobileを用いることで、非常に簡単にリッチなインターフェースを持つwebアプリケーションを作ることが出来ます。 対象読者 JavaScriptでの開発経験がある方 jQueryを使用したことがある方 jQuery Mobile jQuery Mobileは、jQueryを開発しているThe jQuery Projectによって開発されたスマートフォン向けのJavaScript UIフレームワークです。iOSやAndroid、Windows Phone、BlackBerry等の様々なモバイルプラットフォームとデバイスに対応していて、OSに依存しないUIを提供しています。 jQuery Mobileでは、独自に定義したHTML5のカスタムdata-*属性を指定することで、リストビューやナビゲーション
jQueryのプラグイン33+1選 -2011年9月 | コリス
当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る
`HTML+jQuery` でプレゼンテーションを簡単につくれる `Slippy` をつかってみた
jQuery で書かれたプレゼン用のスクリプト Slippy を使って基金訓練でのスライドを作ってみたのでそのメモとか。Slippyのライセンスはたぶん修正BSD 使い方はデモを見ればOKデモページのスライドがSlippyの使い方の説明になっているので読めば使い方は分かる。 戻る : 左矢印キー進む : 右矢印キー, スペースキー, ダブルクリック一覧表示 : Escキー, Delキー, Tabキー (その後クリックでスライド選択)指定したページへジャンプ : 数字を入力後 EnterソースのメモHTMLの書き方についてのメモ 使うときはコードを軽く書き換えるだけでOKIntroducing Slippy - HTML Presentations - Jordi Boggianoに github へのリンクがあるのでそっからソースをダウンロードする。で、HTMLファイルの中身を見ればどう書
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
jQuery逆引きリファレンス － ＠IT
HTML5、JavaScript、Android を勉強しよう