動画のサイズ指定について

前へ 次へ
このQ&Aのポイント
  • 動画のサイズ指定について質問があります。
  • 具体的には、ルー大柴さんの動画のサイズを変更したい場合、どのような指定が必要か知りたいです。
  • また、動画のタイムライン部分を除外して、サイズを変更することは可能かも確認したいです。
回答を見る
  • ベストアンサー

動画のサイズ指定

例えばこちらの http://www.13hw.com/channel/interview/Lou_Oshiba_01.html ルー大柴さんの動画ですが、ソースを見ると、サイズが width="365" height="275" となっています。 これって下のタイムライン部分（正式名称わからないです…動画をストップさせたり音量を調整できる部分）を入れてこのサイズなんですよね。 もしこれを、縦も横も半分にしたい場合、単純に1/2でいいんですか？ 下の部分はサイズ変更しても高さが変わりませんよね？ 下部分を入れないとwidth="365" height="255"、 下部分は高さが20pxでした。 width="365/2" height="275/2"のサイズですか？ width="365/2" height="255/2+20"のサイズですか？

  • HTML
  • 回答数1
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
  • SAYKA
  • ベストアンサー率34% (944/2776)
回答No.1

動画の場合はコントローラ含みでその大きさだから前者の値だね。 ただし、コントローラまで半分になってくれない場合は想定通り後者になるけれど、そこの辺りは動画を再生するものによって違うし、コントローラ部分のサイズを指定できる場合もあるからそのメディアをHTMLに埋め込む為の記事を探してみた方が良いかもね。 http://www.tohoho-web.com/wwwmmdia.htm

chikotto
質問者

補足

ありがとうございます。 では、 ●横400、縦300の動画をはりたい。 というときには、 width="400" height="320" そしてそれを半分で表示したい場合は、 width="200" height="220" と記述するわけですね？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • CSSでの画像サイズ指定について

    本などでCSSを練習中です。 画像サイズを自動的に指定したサイズに縮小するCSSは ありますでしょうか？ 以下のよな商品紹介のサムネイルを作りました。 画像部分は常に120×120pxに収まってほしいのですが、 横幅が高さより大きい画像を入れた場合、高さは指定した120pxになりますが(縦横比率は同じ)、横は飛び出してデザインが崩れてしまいます。 正方形の画像はそのまま120×120pxになります。 何かアドバイスをお願い致します。 また、他のおかしいところもご指摘下さい。 【HTML】 <div id="itemBox"> <div class="itemPhoto"><a href="#"><img src="#" alt="商品名" width="120" height="120" /></a></div> <p><a href="#">商品名</a></p> </div> 【CSS】 div#itemBox{ border: 1px solid #9f9f9f; width: 120px; margin: 10px; float: left; text-align: center; padding: 10px; height: 150px; } div#itemBox p{ float: left; text-align:left; width: 120px; margin-top: 5px; } div#itemPhoto{ margin: 0; padding: 5px; text-align: center; width:120px; height:120px; }

    • 締切済み
    • CSS
  • CSSで、指定されていない空白が開く

    ヘッダーのロゴとその下のナビゲーションの間に、勝手に空白が空きます。 margin: 0;と設定しても空白が空きます。 section#header { width:80%; height: 63px; margin-right: auto; margin-left: auto; } img.LOGO { width: 700px; height: 63px; float: left; } p.intro { color: #383838; float: right; font-size: 120%; } section#links { font-size: 130%; width: 90%; height: 40px; margin-bottom: 40px; margin-right: auto; margin-left : auto; } nav ul li { display: block; float: left; width: 18%; height: 40px; margin-left: 1px; margin-right: 1px; border-left: #000000 2px solid; border-right: #000000 2px solid; } nav ul li a { display: block; line-height: 40px; width: 100%; height: 100%; text-decoration: none; text-align: center; } div#clear { clear:both; } CSSは以上の通り書きました。 このとき、section#headerで設定した、img#LOGOとp.introを含むヘッダー部分と、 section#linksで設定したナビゲーション部分に間が空いてしまいます。 どうすれば開かなくなるでしょうか。 閲覧環境はChromeです。

    • ベストアンサー
    • CSS
  • CSSで画面サイズを縮小するとレイアウトが大きく崩れてしまう

    CSSとXHTMLで、左と右に分かれただけのデザインという少し変わったレイアウトで作ってみたのですが、画面サイズを変更（縮小）すると右側のBOXがすべて左側の下に回り込んでしまいます。 できればスクロールバーなどを出現させて、レイアウトが崩れないようにしたいと考えています。 色々いじくっていたらめちゃくちゃになってしまったのですが、一応CSSを掲載しておきます。 また、左側を○○pxで、右側を残りのサイズというようなwidthの指定の仕方ってあるのでしょうか？ frameとかだと*で対応するみたいなんですが・・・ ひとまず、周り込を回避する方法が優先です。 どうかよろしくお願いいたします。 @charset "shift_jis"; body { margin: 0px; height: 100%; padding: 0px; font-size: 12px; line-height: 150%; } html { height: 100%; } img { border: none; vertical-align: bottom; } #left { background-color: #666666; width: 350px; float: left; min-height: 100%; height: 100%; } #right { height: 100%; padding: 35px 0 0 0; min-height: 100%; width: auto; margin: 0 0 0 350px; }

    • ベストアンサー
    • HTML
  • ウインドウサイズを小さくしてもレイアウトが乱れないようにする方法

    下のHTMLとCSSに、何を追加すればウインドウサイズを変更しても、レイアウトが乱れないようにすることができるでしょうか？ div { float: left } div.Kukaku1 { background-color:blue; width: 900px; height: 150px; } div.Kukaku2_1 { background-color:green; width: 300px; height: 25px } div.Kukaku2_2 { background-color:aqua; width: 300px; height: 25px } div.Kukaku2_3 { background-color:gray; width: 300px; height: 25px } div.Kukaku3_1 { background-color: black; width: 250px; height: 200px; } div.Kukaku3_2 { background-color: fuchsia; width: 650px; height: 150px } div.Kukaku3_3 { background-color: lime; width: 650px; height: 50px } div.Kukaku4_Ga { width: 450px; height: 150px } div.Kukaku4_1 { background-color: maroon; width: 450px; height: 80px } div.Kukaku4_2 { background-color: navy; width: 450px; height: 70px } div.Kukaku4_3 { background-color: red; width: 450px; height: 150px } <div class="Kukaku1"></div> <div class="Kukaku2_1"></div> <div class="Kukaku2_2"></div> <div class="Kukaku2_3"></div> <div class="Kukaku3_1"></div> <div class="Kukaku3_2"></div> <div class="Kukaku3_3"></div> <div class="Kukaku4_Ga"> <div class="Kukaku4_1"></div> <div class="Kukaku4_2"></div> </div> <div class="Kukaku4_3"></div> 回答よろしくお願いします。

    • ベストアンサー
    • HTML
  • CSSのレイアウト指定だけが無効に。

    CSSでデザインを始めたばかりの初心者です。 Mac環境で制作しておりますが、WIN環境に限り、レイアウト指定がうまく反映されません。（MacではIEとsafariで確認済み。） というか、レイアウトの記述部分だけ、無効になっているような印象です。 文字・リンク・imageの指定はきちんと反映されています。 現象が起きているページは下記です。 http://www.artbox-int.co.jp/seek/foragent/illust_a.html CSSの問題の部分です。 /*レイアウト*/ .head { border-width:0px; } .mainhead { width:200px; height:45px; margin-top:15px; margin-left:15px; border-width:0px; } .menu { width:250px; height:45px; margin-top:-42px; margin-left:230px; border-width:0px; } .select { margin-top:-25px; margin-left:35px; border-width:0px; } .table { margin-left:15px; margin-top:15px; width:480px; height:180px; border-color:#D9D9D9; border-width:1px; border-left-width:5px; border-style:solid; background-color:#FFFFFF; } .image { margin-top:15px; margin-left:15px; border-width:0px; } .Artistname { margin-top:-148px; margin-left:180px; width:200px; height:45px; border-width:0px; } .history { margin-top:-31px; margin-left:180px; width:280px; height:100px; border-width:0px; overflow:auto; } .other { margin-left:180px; width:280px; height:30px; border-width:0px; } どうぞよろしくご教授お願い致します。

    • ベストアンサー
    • CSS
  • ThickboxでHTMLを指定サイズで表示したい

    ThickboxでHTMLページを指定したサイズで表示させたい。 お世話になります。 自社サイトでthickboxを使用したいと考えています。既に画像をクリックして大きな画像を表示させる（オーバーレイ表示）ためにthickboxを導入しており、それは比較的簡単だったのですが、今回は別個に作成したHTMLページを同じようなデザインで表示させたいと思っています。 いろいろなサイトを参考にしてこのようなソースになりました。table{width:800px;height:600px}が記述されたsample01.htmlというページをやはりwidth:800px、height:600pxでthickboxでオーバーレイ表示させたいというのが目標です。 <head> <link href="css/thickbox.css" rel="stylesheet" type="text/css" media="all"/> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/thickbox.js"></script> </head> <body>～中略～ <a href="sample01.html?width=800px&height=600px" class="thickbox"><img src="images/sample02-small.jpg" alt="画像の説明" border="0"></a> </body> ところが、一応Thickboxは機能するのですが、キレイな形で表示されず、またその理由もよく分からず困っています。初心者なので、つまらないところで行きつまっているかもしれませんが、どうか知恵をお貸し下さい。 ※分からない点 (1)800×600px指定しているのに、小さいサイズで表示され、その文スクロールバーが表示される。インラインフレームのようなデザインにしたくない。 (2)上部にグレー部分ができる（Closeボタン用だと思われるがいらない）。既に画像を表示させる際の場合のように右上部に自分で制作したボタンを配置してCloseボタンとしたい。 既に作成したthickboc.cssは--- #TB_closeWindow{ position:absolute; width:30px; height:30px; top:-15px; right:-15px; } #TB_closeWindowButton{ background-image:url(../images/button-thickbox-close.png); position:absolute; width:30px; height:30px; } (3)表示させたHTMLが文字化けする。 <script type="text/javascript" charset="Shift_JIS"></script>指定しています。 以上です。どうかご教示よろしくお願いします。

    • 締切済み
    • CSS
  • 動画のサイズを小さくするには

    初めまして。こんにちは！ 今、私はブログに貼りたい動画があります…。 でもそのサイズを小さくしたくて… そのサイズを指定するとこはこのどれを変えればいいんですか？？ <object width="425" height="366"><param name="movie" value="http://www.youtube.com/v/4V9uWnFgj7Y&rel=1&border=0"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/4V9uWnFgj7Y&rel=1&border=0" type="application/x-shockwave-flash" wmode="transparent" width="425" height="366"></embed></object> すごく困ってます！！教えていただければ嬉しいです。 よろしくお願い致します。

  • CSS）　emでのサイズ指定

    CSS初心者です。 何のサイズをem単位で指定できるのか調べたくて、適当に h1,h2,h3,h4,p { font-size: 2em; margin: 1em; padding: 1em; margin-border: 1px; border-color: #000000; ligh-height: 1em; border-width: 1px; } としました。 すると、すべてのフォントサイズが同じになりました。 それぞれのヘディングが倍のサイズになると思っていたのですが、なぜこうなってしまったのでしょうか？ また、マージンのサイズ、パッデイングのサイズを視覚的に確認したいのですが、どうすればいいのでしょうか？

    • ベストアンサー
    • CSS
  • フォントサイズでレイアウトがずれる？

    cssでページレイアウトをしているのですが、 外部cssでサイト全体のフォントサイズを13pxにした場合 body { font-size: 13px; } 同じ画像なのに（四角のボタン）下部分の1pxの底辺が表示されるものとされないものが出てきました。 HTMLの記述内容は以下の通りです。 <div class="menu"> <p><img src="/img/**1.png" alt="" width="180" height="33"></p> <p><img src="/img/**2.png" alt="" width="180" height="33"></p> <p><img src="/img/**3.png" alt="" width="180" height="33"></p> <p><img src="/img/**4.png" alt="" width="180" height="33"></p> </div> <p>にmargin、paddingなどは設定していません。 この場合、画像、ｃｓｓ共に同じ条件であるはずなのに、3番目の画像だけ上記のような不具合がおこりました。 フォントサイズを14pxにした場合、問題なく表示されます。 firefoxで確認したところは13px,14px共に、きちんと表示されていました。 ちなみにブラウザはIE6です。 ブラウザのバグか何かでしょうか？？ 申し訳ありませんが、どなたかご教授お願い致します。

    • ベストアンサー
    • HTML
  • javascript画像切り替えにサイズ指定

    何時間探ってもわかりません。。。。 どなたか回答していただけたら幸いです。 下記を参考とても簡単で正常に動きました！ しかし。。。 問題は、画像のサイズを指定したいのですが。。。 どこに挿入したらいいのでしょうか。。？ (現在サイズ指定できていないから画像サイズがばらばら。。) あらゆる場所に width= height= みたいなタグを 入れてみたのですが。。。入れると、起動しない。。 ********************* 表示したい場所に <IMG SRC="画像ＵＲＬ１(*1)"NAME="SP"> <SCRIPT language="javaScript"> <!-- var NO=1; img=new Array(5(*2)); img[1]="画像ＵＲＬ１(*3)"; img[2]="画像ＵＲＬ２(*3)"; img[3]="画像ＵＲＬ３(*3)"; img[4]="画像ＵＲＬ４(*3)"; img[5]="画像ＵＲＬ５(*3)"; UP(); function UP(){ setTimeout("UP()",5000(*4)); document.SP.src=img[NO]; NO=NO+1 if(NO>5(*5)){NO=1;} } //--> </SCRIPT> (*1)－最初から表示されている画像のＵＲＬ (*2)－切り替わる画像の全体数 (*3)－順番切り替わる画像のＵＲＬ (*4)－画像の切り替えスピード(単位はミリ秒) (*5)－一番最後の画像のナンバーを入力します。 ****************************** 参考: http://www.devicereign.net/TOP/support/Jscript/S18.html おまけに、今までは下記のように、 写真に白枠を入れていました。 下記は、三枚の写真が(背景白枠入り)横に並んでいる状況です。 同じ構成で、 この三枚を同時にいくつかの画像と切り替えというのが目的です。 ＊これはページの真ん中に配置しているので、 </table>とかは下の方で行っています。 <tr> <td><div align="center"> <table width="590" border="0" cellspacing="0" cellpadding="0"> <td width="173"><img src="画像1" alt="画像1" style="border:1px solid #cccccc; padding:10px" width="173" height="250" border="0"></a> <img src="画像2" alt="画像2" style="border:1px solid #cccccc; padding:10px" width="173" height="250" border="0"></a> <img src="画像3" alt="画像3" style="border:1px solid #cccccc; padding:10px" width="173" height="250" border="0"></a> </tr> よろしくお願い致します。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する