respontent

JavaScript

様々なコンテンツをレスポンシブにしてくれるjQueryプラグイン「respontent」

respontentというjQueryプラグインを使えば、画像・YouTube動画・テーブル・Googleマップといった様々なコンテンツをレスポンシブにすることができます。部分的に指定した要素をレスポンシブにしたいといった時に活用できますね。

[ads_center]

respontent

実際のデモは以下になります。

respontent

デモ

各コンテンツが左右に分けられており、左側がレスポンシブ付きで右側がレスポンシブなしのバージョンになっています。

真ん中から左右にサイズ変更することができるので、試しに左側を縮小させてみると、このようにレスポンシブ対応になっていることが確認できます。

respontent

応用次第でコンテンツの利便性も高まりそうですね。

例えば、Googleマップなんかは1つを詳細地図で固定化しておき、もう1つをレスポンシブ化させて広域表示させておくといったこともできそうです。

respontent

関連記事

  1. JavaScript

    クールでお洒落なナビゲーションを簡単に実装できるjQueryプラグイン「Kwicks for jQu…

    クールでお洒落なナビゲーションを簡単に実装することができるjQuery…

  2. zoomwall.js

    JavaScript

    高さを揃えたグリッドレイアウトのLightbox系イメージギャラリー「zoomwall.js」

    zoomwall.jsは高さを揃えたグリッドレイアウトを実装することが…

  3. jExcel

    JavaScript

    Excelと互換性のあるスプレッドシートを埋め込めるjQueryプラグイン「jExcel」

    jExcelは、ブラウザにExcelと互換性のあるスプレッドシートを埋…

  4. quick-select

    JavaScript

    素早く簡単に選択できるセレクトボックス「quick-select」

    quick-selectは素早く簡単に選択可能なセレクトボックスを実装…

  5. jQuery.Flexdatalist

    JavaScript

    テキスト入力候補を表示させれる「jQuery.Flexdatalist」

    jQuery.Flexdatalistはテキスト入力候補を表示させるこ…

  6. no-image

    JavaScript

    フラットでシンプルなカラーピッカー実装「Pickr」

    Pickrはフラットでシンプルなカラーピッカーを実装できるのが特徴です…

最近の記事

  1. CITTA TT5.0
  2. Kindle Oasis
  3. OWL-WDDESK01
  4. ワンタッチ着脱フィルターキット

アーカイブ

PAGE TOP