スマホ対応の優れもの！クリック・タップの直前にページを先読み、高速表示する超軽量スクリプト -instant.page | コリス

2019/02/12 56 users コリス hover touchstart 超軽量スクリプト

ユーザーがリンクをクリックする際のhoverとタップする際のtouchstartに合わせて、クリック・タップする直前にページのHTMLをプリロードし、高速に表示するわずか1kBの超軽量スクリプトを紹介します。 ページに外部スクリプトを1つ加えるだけの簡単実装です。 instant.page instant.page -GitHub instant.pageの特徴 ins... 続きを読む

放棄ドメインの大量取得によるスクリプトの乗っ取りについて - tike blog

2019/01/26 248 users スクリプト リソース 役目 tike blog ドメイン

はじめに 既に役目を終えたドメインの遺産はリンク切れという形でインターネット上に残ることがあります。 ここでいう遺産とは、放棄ドメインに紐付くリソース(画像、外部スクリプトなど)を指します。 閲覧者の目に直接触れるリソース(画像や動画など)が存在しない状態になったことを閲覧者自身が認識することはさほど難... 続きを読む

Bootstrapにフォームのバリデーションや通知パネルなど、便利な機能を簡単に追加できるスクリプト -Smoke | コリス

2015/06/01 168 users jQuery Smoke コリス Bootstrap コード

Bootstrapで作成したページに、外部ファイルと数行のコードを加えるだけで、さまざまな便利な機能を追加できるjQueryのプラグインを紹介します。 Bootstrapの対応バージョンは、3.xです。 Smoke Smoke -GitHub Smokeの使い方 Smokeのデモ Smokeの使い方 Smokeの使い方は、簡単です。 Bootstarpでつくったページに、外部スクリプト・スタイルシ... 続きを読む

WordPress で jQuery を使う時の注意点 | EastCoder;

2014/07/10 85 users jQuery EastCoder 要点 WordPress

慣れていない方には解りにくいところがあるようですので、いまさらですが要点をまとめます。 特別な理由がない限り WordPress に含まれている jQuery を使う WordPress には外部スクリプトを読み込むための独自の仕組みがあります。また、WordPress インストールには初期状態で jQuery が含まれており jquery というスクリプトハンドルですぐに呼び出せる状態となってい... 続きを読む

[JS]ページ上のあらゆる要素を簡単にレスポンシブ対応にするスクリプト -Responsive Elements | コリス

2013/09/17 68 users コリス jQuery class スクリプト ピクセル単位

外部スクリプトを加えるだけで、ページ上のあらゆる要素にレスポンシブ対応のclassを利用できるようにするjQueryのプラグインを紹介します。 ブレイクポイントはピクセル単位で細かく、そして複数設定することが可能で、さまざまな表示幅に最適化なスタイルを特定の要素に適用できます。 Responsive Elements Responsive Elements -GitHub Responsive E... 続きを読む

[JS]便利で簡単！スクリプトやスタイルシートをブラウザ・OSごとに分岐して利用できる超軽量高速のスクリプト -Conditionizr | コリス

2013/01/30 253 users class Opera WIn Safari Firefox

IE6/7/8/9/10, Firefox, Chrome, Safari, Operaなどのブラウザだけでなく、Win, Mac LinuxなどのOS、iPadやiPhoneのRetinaディスプレイ用に条件分岐して、外部スクリプトやスタイルシートをロードさせたり、classを付与してHTMLで利用できたりする超軽量高速の単体で動作するスクリプトを紹介します。 Conditionizr Cond... 続きを読む

[JS]スクロールするのが楽しくなる！多彩なパララックスのエフェクトを簡単に実装できるオープンソースのスクリプト -Jarallax | コリス

2012/10/16 326 users パララックス script src コリス jquery.js

Loodsmedia ディスプレイ内のコンテンツもパララックスします。 Jarallaxの使い方 「Demo 3」を例に、実装方法を簡単に紹介します。 外部ファイル 「jquery.js」と当スクリプトをhead内に外部スクリプトとして記述します。 <script type="text/javascript" src="jquery.js"></script> <script type="text... 続きを読む

[JS]カラー画像を白黒に自動変更して表示する画像ギャラリー -Black and White | コリス

2011/07/25 69 users コリス jQuery script jquery.js 白黒

カラー画像を白黒のグレースケール画像に自動変更して表示する画像ギャラリーのjQueryのプラグインを紹介します。 デモページ：マウスホバー（2番目）でカラー表示 Black and Whiteの実装 外部スクリプト 「jquery.js」と当スクリプトを外部ファイルとして指定します。 <script src="js/jquery.min.js"></script> <script src="js/... 続きを読む

[JS]背景画像やスライドショーをブラウザいっぱいに表示するスクリプト -Vegas | コリス

2011/05/22 277 users コリス jQuery jquery.js ウェブページ 実装

写真画像をブラウザいっぱいに表示し、ウェブページにフル表示の背景画像やスライドショーを設置するjQueryのプラグインを紹介します。 ドットベースのオーバーレイ用の画像が数多く用意されているので、画像にスタイリッシュなエフェクトを加えることも簡単にできます。 デモページ サムネイルをクリックすると、写真画像が変更されます。 Vegasの実装 外部スクリプト 「jquery.js」と当スクリプトを外... 続きを読む

[JS]高さの異なるカラムを揃えるスクリプト -equalHeights.js | コリス

2008/10/15 209 users コリス div function カラム スクリプト

Setting Equal Heights with jQuery デモ 使用方法は、スクリプトを外部スクリプトとして指定し、高さを揃えたいカラムすべてを内包するdivを記述します。 そのdivのidをスクリプトに記述します。デモでは「id="equalize"」を指定しています。 $(function(){ $(’#equalize’).equalHeights(); }); idではなく、クラ... 続きを読む

[JS]超軽量で設置も簡単な、透過PNGをIE6で表示するスクリプト -Unit PNG Fix | コリス

2008/07/09 337 users fix コリス 透過PNG スクリプト 透過PNG画像

Unit Interactiveのエントリーから、透過PNG画像をIE6で表示する、超軽量(2KB)の設置も簡単なスクリプトを紹介します。 Unit PNG Fix 透過PNGの表示は普通の画像や背景画像に対応しており、HTMLファイルに外部スクリプトとして指定するだけ適応されます。 スクリプトの設置には1×1の透明GIF画像が必要で、ファイル名・パスはスクリプトの1行目を変更することで自由に設定... 続きを読む