Camera is a responsive/adaptive slideshow. Try to resize the browser window It uses a light version of jQuery mobile, navigate the slides by swiping with your fingers
select要素のoptionを分かりやすく 表現する、というライブラリです。 選んだ項目にあわせて設定した画像 が表示、選んだoptionに連動しま す。これは結構いいアイデアじゃ 無いかなと。 select要素のユーザビリティ向上、みたいなスクリプトです。jQueryに依存します。 こんなやつです。選ぶと画像にも青い枠が付く、みたいなの。画像はマークアップせず、option要素にカスタムデータ属性を与える事で実装します。 Sample 選択すると画像の選択箇所も連動します。 コード<script src="jquery.min.js" type="text/javascript"></script> <script src="image-picker.min.js" type="text/javascript"></script>本体とプラグインを読み込んで $(".foo").ima
タッチイベントを取得する各スクリプトの対応イベント、スタンドアローンなのかjQueryが必要なのか、ファイルの容量など、仕様の比較をまじえて紹介します。 QUOjs イベント タッチ、タップ、ダブルタップ、ホールド、フィンガー、スワイプ、スワイプアップ、スワイプライト、スワイプダウン、スワイプレフト、ドラッグ 補足 jQueryとのコンフリクトを避けるため、「$$」を使用。 対応予定(2フィンガータップ、ロウテイト、ピンチアウト、ピンチ) 仕様 スタンドアローン ファイルサイズ Minified: 13KB Hammer.js イベント タップ、ダブルタップ、ホールド、ドラッグ、ピンチ 補足 タッチジェスチャだけにフォーカスしたスクリプト。 仕様 スタンドアローン jQueryのプラグインも有り ファイルサイズ Minified: 2KB [ad#ad-2] jGestures イベント
ギャラリー、スライダー等、複数画像の見せ方を色々提供するjQueryプラグイン「Rondell」 2013年02月12日- Overview - jQuery Rondell ギャラリー、スライダー等、複数画像の見せ方を色々提供するjQueryプラグイン「Rondell」。 次のように、カルーセルやスライダー等、様々な画像ギャラリーのUIを実現することができます。 多機能だけじゃなくて、カッコいいところもいいです。サンプルサイトがBootstrapベースですが、Bootstrapベースのサイトに入れても違和感なく埋め込めるでしょう。 カルーセル スライダー スクローラー サムネイル付きギャラリー。動きもいい感じ 関連エントリ ブラウザ上でまるで美術館。3Dイメージギャラリーデモ 卓上に写真を置いたようなインタフェースのギャラリー作成用のjQueryプラグイン サムネイルがシャッフルされてク
シンプルなスライドショーや少し変わったエフェクトのスライドショーなどを、ジェネレーターを使って簡単に実装できる、Rhinoslider というjQueryのプラグインを見つけたので使い方などをまとめてみました。 pontoffeltier/Rhinoslider: The most flexible jQuery slider/slideshow Rhinosliderは、エフェクトやアニメーション時間などのオプション設定を画面内のGeneratorで選択すると、コードを出力してくれる親切な形になっています。画面内で設定したスライドショーのプレビューもでき、そのプレビューのデモファイルもダウンロードできます。 ※スライドショーのプレビューのサイトは閉鎖されてしまったようです。プラグイン自体はGithubよりダウンロード可能です。 Generatorでコードの生成をする 「Demo & Do
This jQuery plugin enables very basic bookmarkable #hash history via a cross-browser HTML5 window.onhashchange event. While this functionality was initially tied to the jQuery BBQ plugin, the event.special window.onhashchange functionality has now been broken out into a separate plugin for users who want just the basic event & back button support, without all the extra awesomeness that BBQ provide
ブログ初投稿初Advent Calendarです!これをきっかけにHTML5 + CSS3 + JSについて書いていけたらなーと思ってます。 Advent Calendarって何?って方はこちら。 私はあまり知識が深くないので、今までの皆さんと違って軽さ重視で行きます!! 今日はqtipの使い方について簡単にご紹介します。 ご紹介するのはqTip2です。 知ってるよ〜。という方も多いかもしれません。知らなかった〜という方はぜひ見ていってください。 qTipって何? qTipとは吹き出しをつけるjQueryのプラグインです。 文章に対してつけたり、グラフをhoverすると出るようにしたり、様々な用途で使用できます。 そして今気づいたのですが、jsfiddleが埋め込めないんですねはてなダイアリー・・・・。埋め込めるよ!って見つけたのですがうまくいきませんでした。残念。 どうやって使うの? さ
jqModal is a plugin for jQuery to help you display notices, dialogs, and modal windows in a web browser. It is flexible and tiny, akin to a "Swiss Army Knife", and makes a great base as a general purpose windowing framework. Features; Designer Frieldly - Use *your* HTML+CSS for Layout and Styling Translator/i18n friendly - No hardcoded English strings Developer friendly - Extensible through callba
jQuery throttle / debounce: Sometimes, less is more! jQuery throttle / debounce allows you to rate-limit your functions in multiple useful ways. Passing a delay and callback to $.throttle returns a new function that will execute no more than once every delay milliseconds. Passing a delay and callback to $.debounce returns a new function that will execute only once, coalescing multiple sequential c
僕は人の名前を覚えるのが苦手です。それはさておき、jQueryプラグインの作成方法について頻繁に忘れるので、手順をここにまとめておくことにします。コレさえ読めば急にプラグインを大量に作れといった無茶ぶりをされても大丈夫。 多い日も安心♪(ゝω・)vキャピ はじめに - jQuery プラグインの構成 細かい差はあれど、基本的にjQueryプラグインは以下のような構成で成り立っています。 // 匿名関数で全体をラップ - (5) (function($) { // このプラグインの名前 - (1) $.fn.name_space = function() { //要素を退避 - (2) var elements = this; // 要素をひとつずつ処理 - (3) elements.each(function() { // 具体的な処理をここに記述 }); // method chain
HTML5のvideo要素やaudio要素をサポートしていないメジャーブラウザでもたった一行、ページに追加するだけでこれらを利用できるようにするスクリプトを紹介します。 html5media デモページ [ad#ad-2] html5mediaの実装 html5mediaの利用方法は簡単です。 ページに追加する一行 下記をページのhead内に記述します。 <script src="http://api.html5media.info/1.1.4/html5media.min.js"></script> これだけで、すべてのメジャーブラウザでHTML5のvideoとaudioを利用できるようになります。 video, audioに非対応のIE7でも期待通りに動画が再生されます。 IE6(IE Tester)でのキャプチャ 参考:video, audioのサポート状況 video, audio
What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice
The plugins site is currently in development. We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, includi
Moreno Di Domenico personal portfolio's website.
Update to jQuery Visualize: Accessible Charts with HTML5 from Designing with Progressive Enhancement A while ago, we came up with a technique for creating accessible charts and graphs that uses JavaScript to scrape data from an HTML table and generate bar, line, area, and pie chart visualizations using the HTML5 canvas element. This technique provides a simple way to generate charts, but more impo
Cover Flow is a 3D virtual environment for displaying graphic elements (see GUI), which became known as navigation for music collections. The covers of the music albums are positioned virtually in a row. Like in a catalogue, you can browse through a music collection with an input device (e.g. with the mouse). Cover Flow was developed by the company Steel Skies, the latest version of which was avai
| HOME | README | DEMO | CLASS | CHANGE LOG | DONATE | LICENSE | | Conditional Selector | Boot Loader | | uuAltCSS | uuAltCSS.getExStyle | uuAltCSS.setExStyle | uuAltCSS.redraw | | position: fixed | 透過 png | max-width: | opacity: | -uu-display: table | -uu-text-shadow: | | -uu-box-shadow: | -uu-box-reflect: | -uu-border-radius: | -uu-gradient() | multiple backgrounds | | -uu-box-effect: | Cond
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く