smoothState.js - 滑らかな画面遷移を提供 MOONGIFT
スマートフォン向けのWebサイトなどでは画面遷移が大事です。普通のURLを遷移するような動きではUXがよくありません。新しいコンテンツがスライドしてきたり、前の画面と滑らかに入れ替わることでユーザの意識を切らさずに操作を継続できるようになります。 そうした動きをサポートしてくれるライブラリがsmoothState.jsです。履歴管理も行ってくれるライブラリです。 smoothState.jsの使い方 デモです。クリック時にコンテンツがスムーズに表示されます。 アニメーションのされ方も複数あります。 メニューで使うパターンです。 smoothState.jsを使うと画面遷移はもちろん、履歴管理も行ってくれます。スマートフォンはもちろんデスクトップブラウザでも利用できるでしょう。多くのフレームワークでは同様の機能がありますが、大げさになってしまいます。遷移機能だけ欲しい時に良さそうです。 sm
jquery-rsSlideIt - 2D/3Dでダイナミックなスライド切り替え MOONGIFT
BorderColorAnimate - 枠線をアニメーションさせるjQueryプラグイン
これからは今まで以上に、jQueryが必要なくなるかもしれない
3, 4年前あたりから、jQuery無しでこう記述するとか、jQueryの一部の機能を代替する軽量スクリプトなどが出始めました。 2017年も半年が過ぎ、その状況はさらに変わり始めています。 (Now More Than Ever) You Might Not Need jQuery 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 現在のブラウザ事情 jQueryに替わる、JavaScriptの選択肢 マイクロライブラリの台頭 IE9への対応はポリフィルで NodeListの反復 jQueryは遅いのか？ jQueryについて私が嫌いなもの $なしでは生きていけない？ 現在のブラウザ事情 jQueryが2006年にリリースされてから、DOMとブラウザのAPIは飛躍的に向上しています。2013年に「You Might Not Ne
誰もが知っておくべきjQueryのTips - Qiita
軽量なのに強力！jQueryそっくりなJavaScriptライブラリ「Umbrella」とは？
長いページをサクッと分割！メモると便利なjQueryページネーションプラグイン
ClockPicker
A clock-style timepicker for Bootstrap (or jQuery). Download ZIP CSS < 6KB, JS < 9KB, after minified. Browser support All major browsers are supported, including IE 9+. It should look and behave well enough in IE 8. Device support Both desktop and mobile device are supported. It also works great in touch screen device. Dependencies ClockPicker was designed for Bootstrap in the beginning. So Bootst
jquery.balloon.js Demo page
jquery.balloon.js Demos A jQuery plugin to add balloon tips to elements User-friendly, fine-tunable and without css and images Getting started (1) Download and load this plugin javascript file after jQuery. <script src="/js/jquery.balloon.js"></script> (2) Call $().balloon(options) in document ready event of jQuery. $(function() { $('selectors').balloon(options); }); Distinct features Without css
jQuery学習者にReactも学習してほしい3つの理由と学習方法まとめ
Webサイトにツアーコンテンツを実装するjQueryプラグイン・jQuery TourBus
Webサイトツアーを実装できる、というスクリプトのご紹介。jQueryに依存します。よくある類のものと変わりませんが個人的に使いやすい印象だったので備忘録として。 Webサイトツアーです。そこまで多用する機会は無いのですけど・・ よくあるツアーコンテンツ。キャプチャはオーバーレイですが、オーバーレイ無し等も可能です。 $(document).ready( function() { var tour = $('#foo').tourbus( {} ); } );jQueryと本プラグインを読み込み、上記のコードを書けば準備完了です。あとはオプションを書いていくだけ。 ドキュメントが非常に充実していますので詳細は本サイトでご覧ください。 jQuery TourBus
textareaでオートコンプリート機能を実装するjQueryプラグイン・jQuery.textcomplete
Twitter Bootstrap向けのMarkdownエディタを実装出来るスクリプト・Bootstrap Markdown
ページ内の目次を自動生成するjQueryプラグイン・jQuery Jump To
ページ内の目次を自動生成する、というスクリプトのご紹介です。見出しを検出してページ内のナビゲーションを作成出来ます。冗長なページにはあると良さそうですね。 ページ内の見出しを使ってナビゲーションを作成します。現在閲覧中の見出しにもスタイルを当てられますのでユーザーに分かりやすいナビゲーションを作成出来そうですね。 長いページにはページ内ナビゲーションがあると便利。ドキュメントや規約など冗長化しやすいコンテンツと相性良さそうです。 $(document).ready( function() { $(".page_container").jumpto({ firstLevel: "> h2", secondLevel: "> h3" }); });リンクとして取り出す要素は上記のように指定します。ネストも可能ですが2段階層までの対応のようです。 シンプルなので手軽に使えそうですね。詳細は以下よ
contentEditable属性対応の、オートコンプリートでテキストや絵文字の入力を補完するライブラリ・At.js
任意のテキストを手軽にオートコンプリートとして実装できるjQueryプラグイン・Completer
送信フォーム等で任意のテキストを手軽にオートコンプリートとして出せるようにする、というスクリプトのご紹介です。手軽さが気に入ったのでメモ。 簡単にオートコンプリート機能を付与できるスクリプトです。ファイルサイズは非圧縮で10KBほど。jQueryに依存しています。 文字を入力すると、いくつかのメールアドレスが候補として表示されます。 <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="completer.min.js"></script>本体とプラグインを読み込みます。 <input type="text" completer data-separator="@" data-source="['gmail.com', 'live.com', 'yahoo.ne.jp', 'i.so
textareaやinput要素内の任意のテキストをハイライトするスクリプト・jQuery highlightTextarea
textareaやinput要素内の任意のテキストをハイライトするjQueryプラグインのご紹介です。どこかで利用する機会があるかと思ったので備忘録。 フォームの入力項目でユーザーの入力したテキストに、設定したテキストがマッチしたらハイライトする、というもの。 東京と江戸をハイライト設定しています。 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="jquery.highlighttextarea.min.js"></script>本体とプラグインと用意されているCSSを読み込みます。 $('textarea').highlightTextarea({ words: [{ color: '#ADF0FF', words: ['foo',
マテリアルデザイン風ボタンをjQueryとCSSで実装する方法｜BLACKFLAG
Webサイト上の要素の動きや操作によってユーザーに「触覚」を生み出すマテリアルデザイン。 そんなマテリアルデザインの一種として ボタンをクリックした際に、そのクリックしたポイントから波動を出す動作があります。 その動作をjQueryとCSSを使って実装する マテリアルデザイン風ボタンを作ってみたので紹介してみます。 「マテリアルデザイン風ボタンをjQueryとCSSで実装する方法」サンプルを別枠で表示 画面上にあるボタンをクリックすると そのクリックしたところをポイントとして 円形の波動が広がるアニメーションを実行させます。 クリックしたポイントからアニメーションを実装することで 「ボタンをクリックした」ということと クリックした場所が視覚的に明確に分かるようになる効果があります。 このボタン動作の全体構成について まずはHTMLから。 ◆HTML <div id="linkArea">
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
強度の高いパスワードを生成できる「jquery.passwordGenerator」:phpspot開発日誌
JavaTechnology Slot Online | Cara Daftar bermain Slot Online
