https://github.com/maechabin/jquery.cb-iframesize.js
iframeをレスポンシブ対応させるjQuery Plugin
https://github.com/maechabin/jquery.cb-iframesize.js
Last synced: 1 day ago
JSON representation
iframeをレスポンシブ対応させるjQuery Plugin
- Host: GitHub
- URL: https://github.com/maechabin/jquery.cb-iframesize.js
- Owner: maechabin
- Created: 2014-11-18T14:24:41.000Z (over 11 years ago)
- Default Branch: master
- Last Pushed: 2015-07-27T02:40:12.000Z (almost 11 years ago)
- Last Synced: 2025-08-18T15:34:03.551Z (10 months ago)
- Language: JavaScript
- Homepage: http://mae.chab.in/archives/2527
- Size: 2.43 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
#jquery.cbiframesize.js
##<概要>
ブラウザに表示させている`iframe要素の高さ`をコンテンツの横幅(画面の横幅)に応じてアスペクト比を維持したまま伸縮させるjQueryプラグイン(リアルタイムリサイジング対応)
##<実装方法>
###1.外部ファイルを読み込む
jQueryと当プラグインをページに読み込む
```
```
###2.iframe要素
・高さを変更したいiframe要素に任意のidやclass属性を付与
・タグ内またはCSSでiframeのサイズを指定しておく
```
```
###3.プラグインを実行
jQueryのセレクタで高さを変更したいiframe要素を取得し、当プラグインの.cbIframeSize()メソッドを実行する
```
$(".iframe-class").cbIframeSize();
```
##<デモ>
[http://jsrun.it/maechabin/ryzq](http://jsrun.it/maechabin/ryzq)
##<ライセンス>
MIT license