ドットインストール代表のライフハックブログ
![IDEA * IDEA](https://cdn-ak-scissors.b.st-hatena.com/image/square/8726767b51882edce9972c7a9196f8c101a01462/height=288;version=1;width=512/http%3A%2F%2Fwww.ideaxidea.com%2Fwp-content%2Fuploads%2F2012%2F10%2Fwebsanova_jquery-url.png)
Garlic.js allows you to automatically persist your forms' text field values locally, until the form is submitted. This way, your users don't lose any precious data if they accidentally close their tab or browser. It strives to have a javascript agnostic interface for UI/UX developers that might want to use it. Just add some data-persist="garlic" in your form tags, and you're good to go!
タッチイベントによるホイール スクロール等を可能にするjQuery のプラグイン。ラッチ(カチカチ感) の無い、慣性ホイールスクロール も実装可能です。ドラッグや フリックなども対応してるみたい。 ラッチの無い慣性ホイールスクロールをタッチデバイスで実装出来る、というスクリプト。タイトルはアレですが、そのほかスワイプなどにも対応しています。 慣性ホイールスクロールを可能にするライブラリ。それ以外のタッチイベントにも対応していますが、特にホイール操作が気持ちよかったです。 以下サンプル。※タッチデバイスのみで動作します。 Sample コード <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script src="jquery.touchy.js"></scrip
Pig ham: hock pork loin brisket pastrami frankfurter andouille. Sausage: ground round sirloin ball tip beef ribs. Pig ham: hock pork loin brisket pastrami frankfurter andouille. Pork turkey: shoulder, filet mignon chuck t-bone bacon. Short loin: pig jowl fatback, pork loin pork chop. Sausage: ground round sirloin ball tip beef ribs. Pig ham: hock pork loin brisket pastrami frankfurter andouille. P
Tagged in JavaScript • Aug 4, 2012 • 2 mins read • by Todd Motto jBar is a simple and lightweight jQuery notification bar that’s been revisited and rewritten (18.11.2012) as an official plugin, which serves up loads of easy customisable options. The jBar allows you to create a simple call to action and bring it forward for the user to see at the top of your website. The user can then toggle the vi
Install Download isotope.pkgd.js un-minified, or isotope.pkgd.min.js minified CDN Link directly to unpkg. <script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.js"></script> <!-- or --> <script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script> Package managers Install with npm: npm install isotope-layout Install with Bower: bower install isotope-layout --save
どうも、はやちです_(:3」∠)_ スマホに使うとよりサイトが見やすくなるjQueryをまとめてみました。 アコーディオン アコーディオンみたく開閉式のメニューが実装できるjsです。 記事の多いコンテンツをまとめるのに便利ですね。 ■動きをみる HTML <dl class="acordion"> <dt class="trigger">アコーディオンメニュー<span class="open-close">open</span></dt> <dd class="acordion_tree">テキストテキストテキストテキストテキストテキストテキストテキスト</dd> <dd class="acordion_tree">テキストテキストテキストテキスト テキストテキストテキストテキスト</dd> <dd class="acordion_tree">テキストテキストテキストテキストテキストテキ
チャットモンチーの新作早く聴きたーい!みなさん、こんにちは nakamura です。 よくウェブカタログ等で画像の拡大表示機能を見掛けますが、とあるプロジェクトで似たような要件を満たす必要がありました。ただし FLASH は NG。ということで JS ベースのものを探していた所、中々シンプルで使いやすいプラグインがあったので今回紹介してみたいと思います。 jQuery Zoom プロジェクトページはこちら。Jack Moore さんって Colorbox とかも作ってる人なんですね~。いつもお世話になってます! 使い方 とりあえずダウンロードして適当な場所に展開しましょう。ソースコードは Github で公開されているので、以下からどうぞ。 jackmoore/zoom 一緒にくっついてくる demo.html やプロジェクトページを見ればだいたいの使い方は分かると思いますが、最低限必要な
The jQuery plugin for equalizing the height or width of elements Download Equalize.js on github. Download it here. How to Use Call the plugin on the parent of the elements to equalize their height. $('#height-example').equalize(); Equalize will accept any of the jQuery Dimension methods: height, outerHeight, innerHeight, width, outerWidth, innerWidth. $('.parent').equalize('height'); // default, s
Livestamp.js - a simple, unobtrusive jQuery timeago plugin 〜秒前の実装を簡単にするjQueryプラグイン「Livestamp.js」 最近のリアルタイムなWEBでは、〜秒前、〜時間前といった表示がよくされていて、画面の遷移がなくてもこれが切り替わったりしますが、同じような実装を実現するためのプラグインです。 自分で実装しちゃってもよさそうですが、仕組みとして面白かったのでご紹介。 UNIXのタイムスタンプをタグに入れておいて、後は初期化という感じの使い方です。 待っていると表示が変わることを確認出来ると思います リロードがないと、実は5分前なのに1分前と表示するよりも、こうやってリアルタイムに更新してあげるのはやはり良いUIといえますね 関連エントリ 時間の入力を楽にすることが出来るjQueryプラグイン Youtube動画を自由
A jQuery plugin that uses the CSS3 image filters to replicate the tilt-shift effect. This is a proof of concept and currently only works in Chrome & Safari 6. download Download here or go to github. Released under GPL how to use Call the plugin on any collection of images you want by adding the following jQuery: jQuery(document).ready(function() { $('.tiltshift').tiltShift(); }); Parameters on eac
flipCounter 1.2 a jQuery plugin by BloggingSquared.ca ペラペラめくれるカウンター実装jQueryプラグイン「flipCounter」 中心に折り目がついててめくれる時計がありますが、アレをカウンターにしたものが登場。アニメーションさせることもでき、なかなかいい味が出せます 必要なライブラリを読込後、$("#counter").flipCounter(); と書くだけで実装できるのは素晴らしい。 各種豊富なオプションで動作をカスタマイズ可能ですし、使われている画像を変えればオリジナルのUIのカウンターが実装できます。 フォーマット指定なんかも可能 アクセスカウンターレンタルサービスなんていうのが昔はよく使っていましたが、こういうカウンターのレンタルがあったら使いたいかもしれませんね。 関連エントリ jQueryでフリップエフェクトを使った
よく見かけるページングの処理で、下の方にスクロールすると自動的に次ページを読み込ませる処理をかんたんに実現してくれるjQuery.autopagerが便利でした。jQueryプラグインです。 導入がかんたんで分かりやすく、オプションも必要最低限のものがバッチリ揃っています。例えば、スクロールで下部までいったら自動的に次コンテンツを表示させるか、それともボタンをクリックして読み込むか、読み込み後にコールバックで関数を読み込ませるか、などなど。 jQuery.autopagerの導入方法 まず、jQuery本体とダウンロードしたjQuery.autopagerを読み込んでおきます。 そして、スクロールで自動表示させるなら下記だけでOK。 <script type="text/javascript"> $(function() { $.autopager(); }); </script> <
Nowadays, one of the most in-demand things in web designing is responsive layouts. Responsive layouts boast some really cool elements which can help designers achieve great results and thus create unique and exclusive websites. These responsive layouts are extremely eye-catching so they can easily attract viewers. Another great feature of these responsive layouts is that they give the designers th
A jQuery Social Plugin to create a single social media stream from multiple social network feeds Socialist is a jquery social feed plugin that combines multiple social media feeds in one place. Use it to combine content and create a social wall from Facebook, Twitter, LinkedIn, YouTube, Pinterest, Flickr, Tumblr, Craiglist RSS and other social networks. Features Aggregates social feeds from Facebo
サイズの異なるボックスを綺麗 に配置してくれるスクリプト、 MasonryっぽいjQueryプラグイン、 Freetile.jsです。似たような スクリプトは結構ありますので 参考までに。 よく見かける、異なるボックスを綺麗に並べるスクリプトです。Masonryっぽいやつ。 こういうやつです。ウィンドウサイズが変わってもボックスを再配置してくれます。 $('#foo').freetile(); 本体とプラグインを読み込んでセレクタ指定します。アニメーションオプション等もありました。 ライセンスはBSDです。手抜きな記事ですけどちょい忙しいので今日はこれにて。 Freetile.js
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く