2012-03-01 5 views
0

実行中のフラッシュビデオを外部ソースからサイズ変更してビデオをリフレッシュさせることはできますか?初心者の質問には申し訳ありません。ビデオをリフレッシュせずに外部ソースから実行中のフラッシュビデオのサイズを変更する

私はこれまでに何を試みて失敗したのですか?

HTML:

<html> 
<head> 
<script type="text/javascript" src="js/jquery.js" ></script> 
<script type="text/javascript" src="js/streams.js" ></script> 
<link href="style/stream.css" rel="stylesheet" type="text/css" /> 
</head> 

<body> 
    <ul id="main"> 
     <li id="one" class="video-player"> 
     <!--AVENGERS TRAILER--> 
     <iframe width="560" height="315" src="http://www.youtube.com/embed/NPoHPNeU9fc" frameborder="0" allowfullscreen></iframe> 
     </li> 
    </ul> 
    <ul id="streams"> 
     <li id="two" class="video-player"> 
      2  
     </li> 

     <li id="three" class="video-player"> 
     3 
     </li> 

     <li id="four" class="video-player"> 
     4 
     </li> 

     <li id="five" class="video-player"> 
     5 
     </li> 
    </ul> 
</body> 
</html> 

CSS:

*{ 
    padding:0px; 
    margin:0px; 
} 

#streams , #main{ 
    list-style:none; 
    float:left; 
    width: 100%; 
} 
.video-player{ 
    background-color:#666; 
    float:left; 
    height:390px; 
    width:640px; 
    margin:10px; 
} 

#main>li.video-player{ 
    zoom:100%; 
} 

#streams>li.video-player{ 
    zoom:50%; 
} 

JSスクリプト(私はそれがリフレッシュする動画を引き起こし見たときに終了していないが、私は停止して)それだけのdivのズームプロパティを変更します。それを親divから別のdivに移動することによって

$(document).ready(function() { 
    $('.video-player').click(function() { 

    var parentid = $(this).parent().attr("id"); 

    // Get the id of the div that was clicked 
    var cliked = $(this).attr("id"); 
    var nextdiv = $(this).next().attr("id"); 
    var prevdiv = $(this).prev().attr("id"); 
    // Check the parent . 
    if (parentid == "streams"){ 
     $("#"+cliked).appendTo("#main"); 
     }; 
    if (parentid == "main"){ 
     $("#"+cliked).appendTo("#streams"); 
     }; 
    }); 
    return false; 
}); 

ご協力いただきありがとうございます。

答えて

0

iFrameにビデオを埋め込んでいるだけなので、iframeの幅と高さのプロパティを変更してコンテンツ自体に悪影響を与えることなく埋め込みコンテンツ(YouTube動画)のサイズを変更することはできます。

私は念のために、あなたのための小さなテストを書いた:それは働いた

var sizeIncreaseFactor = 1.05; 

function resizeIframe(){ 
    var myFrame = document.getElementById('myVideo'); 
    myFrame.width = parseInt(myFrame.width) * sizeIncreaseFactor; 
    myFrame.height = parseInt(myFrame.height) * sizeIncreaseFactor; 
} 

<input type="button" onClick="resizeIframe();" value="Click to increase video size"></input> 
<br /> 
<iframe id="myVideo" width="420" height="315" src="http://www.youtube.com/embed/_9bB7r0M9kg" frameborder="0" allowfullscreen></iframe> 
+0

Thxをします。 – Florin

関連する問題