使用 jQuery 动态调整嵌入视频的大小？

Question

我尝试了几种方法，但似乎没有任何效果。我想做的是让我的用户使用给定的嵌入代码发布视频（示例）：

<object id="cnbcplayer" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="380" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0">
 <param name="type" value="application/x-shockwave-flash" />
 <param name="allowfullscreen" value="true" />
 <param name="allowscriptaccess" value="always" />
 <param name="quality" value="best" />
 <param name="scale" value="noscale" />
 <param name="wmode" value="transparent" />
 <param name="bgcolor" value="#000000" />
 <param name="salign" value="lt" />
 <param name="src" value="http://plus.cnbc.com/rssvideosearch/action/player/id/1398301408/code/cnbcplayershare" />
 <param name="name" value="cnbcplayer" />
 <embed id="cnbcplayer" 
        type="application/x-shockwave-flash" 
        width="400" 
        height="380" 
        src="http://plus.cnbc.com/rssvideosearch/action/player/id/1398301408/code/cnbcplayershare" 
        name="cnbcplayer" 
        salign="lt" 
        bgcolor="#000000" 
        wmode="transparent" 
        scale="noscale" quality="best" 
        allowscriptaccess="always" allowfullscreen="true">  
 </embed>

但是，我想将其调整为 300 像素宽。我试过用 jQuery 更新属性，但是没有用。关于什么可以解决这个问题的任何想法？

谢谢

Answer 1

我写了这个函数：

/**
 * resize_embedded resizes embedded videos like youtube videos;
 * Examples: 
 *  - resize_embedded($('youtube_div'), 300, 200);
 *  - Fiddle: http://jsfiddle.net/xjxVC/1
 *
 * Parameters:
 * @param jquery the element that contains the embedded media
 * @param number the new width
 * @param number the new height
 *
 */
function resize_embedded(){

    // Did we receive 3 correct parameters
    if(arguments.length === 3 && $(arguments[0]).length && isNumber(arguments[1]) && isNumber(arguments[2])) 
        ;
    else
        return 0;

    // Clone embedded element
    $c = $(arguments[0]).clone();

    // Resize clone (replace width/height of all children who have them) 
    $c
        .attr('width', arguments[1])
        .attr('height', arguments[2])
        .children().each(function(){     
            $(this).attr('width') && $(this).attr('width', arguments[1]);
            $(this).attr('height') && $(this).attr('height', arguments[2]);
    })

    // Replace target with clone
    $(arguments[0]).replaceWith($c);
}

function isNumber(n){
    return !isNaN(parseFloat(n)) && isFinite(n);
}

演示：http://jsfiddle.net/xjxVC/1

Answer 2

尝试将object 和width: "100%" 放入div 并调整该div 容器的大小。