Динамическое изменение размера встраиваемого видео с помощью jQuery? - PullRequest
Новая
       27

Динамическое изменение размера встраиваемого видео с помощью jQuery?

1 голос
/ 29 января 2010

Я пробовал несколько способов, но, похоже, ничего не работает. Я хотел бы, чтобы мои пользователи публиковали видео с указанным кодом для вставки (пример): 

<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, но это не сработало. Любые идеи о том, что может решить эту проблему?

Спасибо

Ответы [ 2 ]

1 голос
/ 29 января 2010

Попробуйте поместить object с width: "100%" в div и измените размер этого контейнера div.

0 голосов
/ 18 января 2013

Я написал эту функцию: 

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

...