スマホのタッチイベントを一気に実装できる13KBの軽量ライブラリ「QUOjs」:phpspot開発日誌
QUOjs - Micro JavaScript Library スマホのタッチイベントを一気に実装できる13KBの軽量ライブラリ「QUOjs」 タップ、ダブルタップ、ホールド、スワイプ、スワイプ上下左右、ドラッグといったイベントを実装するのに使えそう モバイルということで3G回線にも配慮した13KBは嬉しい。 今後はローテートやピンチイン・アウトにも対応予定だそう 実装はjQueryライクで超簡単。 関連エントリ たった2KBで動作するスマホ用マルチタッチジェスチャーライブラリ「Hammer.js」 スマートフォンでの指ジェスチャの説明に使えるアイコンセット「Cue」
スクロール途中から位置が固定されるナビゲーションを作ってみる
ある程度スクロールすると、途中から位置が固定になるコンテンツを見かけたことはありませんか？ 今回はjQueryを使ってそれを作ります。 デモ1 デモ2 途中から位置が固定されるナビゲーションのデモ 1 & 2 ダウンロード 今回使うHTMLはこんな感じです。 <div id="header"> <h1>タイトル</h1> </div> <div id="container"> <div id="main">左カラム（メインコンテンツ）</div> <div id="sidebar"><!-- サイドバー --> <div id="nav">ここを固定する</div> </div> </div>#mainと#sidebarはfloat: leftしています。 これの#navが表示エリア上部から20pxの位置まで来たら位置を固定したいと思います。 position: fixedを使って固定する
タッチ端末で使える日付ピッカーUI実装jQueryプラグイン「mobiscroll」:phpspot開発日誌
mobiscroll - Wheel scroller/Date and Time picker jQuery plugin for touch devices (Android phones, iPhone, iPad, Galaxy Tab) - Google Project Hosting タッチ端末で使える日付ピッカーUI実装jQueryプラグイン「mobiscroll」 次のようなタッチ端末に最適な日付ピッカーを実装することができます。通常のselectボックスでもOS標準のUIが出てきたりしますが、こちらのほうが利便性が高そうです。 スマートフォン用のUI部分に使っても良さそうです。 すでに色々ありますが、今後もスマフォ用のUIパーツセットがどんどんと出てきそうですね。 関連エントリ スマフォサイト作成時に超便利な画像タッチでタッチ位置をズームできる「Cloud Zoom to
【作ってみた】スクロールで要素が登場するとハイライトしてくれるjQueryプラグイン「scrollHighLighter」
HOMEHTML/CSS【作ってみた】スクロールで要素が登場するとハイライトしてくれるjQueryプラグイン「scrollHighLighter」 この記事は10年以上前の記事です。情報が古い場合がありますのでお気を付け下さい。Webサイトを閲覧していると、一体どこがクリック出来るエリアなのか分からないことがあります。 このプラグインは、画面をスクロールしていって、該当の要素が画面内に登場するとハイライトしてくれるというプラグインです。 デモ ダウンロード 仕組みとしては、指定した要素の上にdivの透明レイヤーを配置して、ハイライト時に一瞬だけ表示という方法で実現しています。 もともとはaタグにバインドして利用することを想定していましたが、他の任意の要素にもバインドできます。 基本的な使い方 html <script src="js/jquery-1.4.4.min.js" languag
独自デザインのスクロールバーにする際に使えるjQueryプラグイン「jScrollbar」:phpspot開発日誌
jScrollbar : make your own scrollbar for scrolling contents with jQuery UI - MyjQueryPlugins 独自デザインのスクロールバーにする際に使えるjQueryプラグイン「jScrollbar」 綺麗にデザインされたバーもブラウザ依存のスクロールバーで台無しになってしまったり、OSによってデザインに違いが出てしまったりとあまりよいことはないですね。 かといってデザインを崩したくない場合なんかで、スクロールさせないわけにもいけないような時に使えそうなプラグインです。 以下のような自由なデザインのスクロールバーが作れます。画像を切り替えることで簡単に独自デザインにも出来ます。 で、独自デザインにしつつも、ちゃんとマウルホイールにも対応しています。 Twitterの新UIなんかでもスクロールバーが独自になっていたり
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.amazingthings.in/2011/06/jquery-plug-in-for-lens-effect-image.html
