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

时间:2010-01-29 06:49:57

标签: jquery flash video embed

我尝试过几种方法,但似乎没有任何效果。我想做的是让我的用户使用给定的嵌入代码发布视频(示例):

<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>

但是,我希望将其调整为300px宽。我尝试用jQuery更新属性,但是没有用。什么可以解决这个问题?

由于

2 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:0)

我写了这个函数:

/**
 * 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