[JS]打ち出しエリアのサイズをユーザーの任意で変更可能にするスクリプト

YouTubeで実装されているプレイヤーのサイズ変更のように、打ち出しエリアのサイズをユーザーの任意で変更可能にするスクリプトをJanko At Warp Speedから紹介します。

実装のイメージ

Create YouTube-like adaptable view using CSS and jQuery
実装したデモページ

デモページでは下記のように、打ち出しエリアのサイズが任意で変更することができます。

デモのキャプチャ

打ち出しエリア:ノーマルサイズ

デモのキャプチャ

打ち出しエリア:ワイドサイズ

各パネルの実装はシンプルで、下記のようなHTMLとなっています。

また、サイズの可変にはjquery.jsが使用されています。

sponsors

top of page

©2025 coliss