TOP

youtube動画をレスポンシブ作用へと実行

youtube動画の埋め込みをシリウスのレスポンシブテンプレート仕様サイトへ張り付けて
スマートフォンで見てみるとサイズ縮小(レスポンシブ化)されておりませんね

 

しかし、youtubeサイトで見れば、レスポンシブ化は適合作用しているのが確認できます

 

なぜ、youtubeサイトでは作用するはずが、シリウスでは反応しないのか?

 

シリウスのレスポンシブ機能が不全というわけではなく、埋め込みコード自体が
レスポンシブ発動の指示を出していないと理解しましょう

 

iframeを見てみますと、width 420が数値指定になっている
<iframe width="420" height="315" src="https://www.youtube.com/embed/k2b0S033o08" frameborder="0" allowfullscreen></iframe>

 

数値指定ならサイズは、パソコンでもスマートフォンでも固定値なので自動縮小は
しないのですね

 

さらに言えば、シリウスのレスポンシブテンプレート、スタイルシートにyoutube用の
可変コードは存在していない

 

 

ですので、パソコン、スマートフォンで適合合わせ表示するには、HTMLでの指定
CSSでの作動を指示する追加指定が必要になるのです

 

ただ、youtube動画をレスポンシブ化すると言ってもどのようにサイズ指定するかで
仕組みを知っていただく必要があります

 

と、いってもコードさえ理解すれば、即座の対処ができるので、詳細を以下親サイトで
ご確認ください(親サイトのyoutube動画レスポンシブ化指定解説ページです)
YouTube動画をシリウスでレスポンシブ化するコード改変.html

 

 

トップページ
youtube動画へのカスタマイズ導入まとめ
トップページ

関連ページ

youtube動画の片隅に画像リンクを配置してみる
youtube動画の上、画面上に画像リンクを置いてみるとクリックされやすいというお話をもとにシリウス専用でカスタマイズしてみました 各カスタマイズをまとめています
youtube動画上に閉じるボタン付きバナー取り付け方法
シリウスレに設営したyoutube動画内にバナー、画像リンクを組み込んでみるというもの、お邪魔なら閉じるボタンで消し去ることもできるという閲覧者サービスの作用設定方法