javascript・jQuenry

最近のWebサイトで使われている、レスポンシブ対応のページレイアウトに役立つスクリプトのまとめ

2016/02/15(Mon) 07:32

レスポンシブ対応のカード型レイアウト、中央で分割されたレイアウト、動画や画像や幾何学模様を背景に配置したり、画像やコンテナのサイズをデバイスごとに最適化したりなど、ページのレイアウトに役立つスクリプトを紹介します。

http://coliss.com/articles/build-websites/operation/javascript/javascripts-for-page-layout.html

Googleが推奨する、SEOに最適な無限スクロールをjScrollで実装する

2016/02/15(Mon) 07:31

今や少し下火になってきている無限スクロール、昔はホットだった。Facebookが使ってるんだし俺らも使おうぜ！ってな感じで、その実装方法が乱れ飛んだのも今は昔

http://toach.click/2016/02/13/infinite-scroll/

意外と今っぽくなる、CSSやjQueryで実現するエフェクトまとめ

2016/02/09(Tue) 07:35

CSSやjQueryで実現する、今までにないようなエフェクトを実現するために知っておくと便利なエフェクトをまとめました。

http://commte.net/blog/archives/5567

実装が面倒なタイムラインコンテンツを簡単に実装できるスタイルシート -Timelined

2016/02/05(Fri) 07:34

垂直に伸びた時間軸にポイントを配置し、そのポイントにコンテンツを紐付かせるタイムラインを簡単に実装できるスタイルシートを紹介します。

http://coliss.com/articles/build-websites/operation/css/css-only-vertical-timeline-contents.html

レスポンシブWebデザイン対応のシンプルなイベントカレンダーを実装出来るスクリプト・「monthly.js」

2016/02/04(Thu) 07:24

monthly.jsはシンプルなイベントカレンダー実装の為のスクリプトです。jQueryに依存しています。レスポンシブWebデザインにも対応しており、デイトピッカーとして利用する事も可能となっています。

http://kachibito.net/useful-resource/monthly-js

[JS]スマホもOK！縦長ページやスライダーでコンテンツをさまざまなアニメーションで表示させるスクリプト -pageSwitch

2016/01/26(Tue) 07:31

縦長ページで次のコンテンツを表示する時、画像やテキストを配置したコンテンツスライダーで、すぅーとスライドさせたり、ぱたり、くるり、ぐい〜んなど、ブラウザいっぱいのコンテンツやパネルをさまざまなアニメーションで表示させるスクリプトを紹介します。

http://coliss.com/articles/build-websites/operation/javascript/js-pageswitch.html

jQuery：画像や要素をランダム出力する方法の備忘録

2016/01/21(Thu) 07:41

jQueryを使って画像や要素などをランダムに並べ替えたり表示させたりする方法の備忘録です。jQueryと言っても乱数を作るのに必要なわけではないですし、特に前半の方などは簡易的なもので尚更JavaScriptだけでできるじゃんって感じがしますが、やっぱり何かと楽に実装できるので使っているだけです…。

http://www.nxworld.net/tips/jquery-random-snippets.html

[JS]アニメーションを使った快適操作がすごい！レスポンシブ対応のフリップコンテンツを実装する軽量スクリプト -jQuery Flipster

2016/01/18(Mon) 07:27

レスポンシブ対応、タッチデバイス対応、CSS3アニメーションを使った快適操作が気持ちいいさまざまなフリップコンテンツが実装できる軽量（5kb）のスクリプトを紹介します。

http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-flipster.html

背景にひと手間加えたい時に便利なスクリプト 10+

2016/01/13(Wed) 07:44

ウィンドウいっぱいの背景に画像や動画を配置したり、ランダムなパーティクルやラインを表示させるなど、主に背景周りで使えそうものや「この領域に何かもうひと手間加えたい…」という時に便利そうだと思うスクリプトを幾つかまとめてみました。

http://www.nxworld.net/tips/background-custom-and-effect-scripts.html

[JS]スマホ・タブレット・デスクトップ時代のクロスブラウザ対策にかなり役立つ便利なスクリプト -Feature.js

2016/01/13(Wed) 07:41

スマホ・タブレット・デスクトップのブラウザがさまざまな機能（WebGL, Canvas, rem unit, async属性、タッチイベントなど）に対応しているか判別し、その判定を利用することができる超軽量（1kb）スクリプトを紹介します。

http://coliss.com/articles/build-websites/operation/javascript/browser-feature-detection.html