文章/答案/技术大牛

发布

社区首页 >问答首页 >在不刷新视频的情况下调整来自外部源的运行flash视频的大小

问在不刷新视频的情况下调整来自外部源的运行flash视频的大小
EN

Stack Overflow用户

提问于 2012-03-02 03:33:21

回答 1查看 854关注 0票数 0

是否可以在不刷新视频的情况下调整来自外部源的正在运行的flash视频的大小？很抱歉问你这个新手的问题。

我到目前为止所做的尝试都失败了。

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来更改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;
});

任何帮助都是非常感谢的。

html

css

javascript

jquery

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-03-02 04:01:54

由于您只是在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

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/9522710

复制

相似问题

问在不刷新视频的情况下调整来自外部源的运行flash视频的大小
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在不刷新视频的情况下调整来自外部源的运行flash视频的大小EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在不刷新视频的情况下调整来自外部源的运行flash视频的大小
EN