Как динамически изменять размер плагина Facebook с помощью JavaScript?

Question

My DIV, показывающий плагин для комментариев Facebook (например, .fb-comments) исправлен CSS, считают, что если я не могу изменить этот CSS, возможно ли изменить размер плагина комментариев с использованием чистого решения JS после загрузки всех комментариев ?

<div style='background-color:red;height:200px;' 
     class="fb-comments" data-href="http://example.com" 
     data-num-posts="10"></div> 

Демо: http://jsfiddle.net/8MyV3/1/

Answer 1

Это очень возможно.

Класс .fb-comments устанавливается через CSS, но вы можете использовать флаг !important, чтобы перезаписать его.

Позволяет получить к нему:

1. Прежде всего, необходимо перезаписать некоторые CSS:

   .fb-comments, .fb-comments * { 
       width:100% !important; 
   } 
   

2. Тогда вы можете разместить свой Facebook Комментарии виджет в своем контейнере

   <div class="fb_container"> 
        <div class="fb-comments" data-href="http://example.com" data-num-posts="10"></div> 
   </div> 
   

3. Дополнительный - Стиль его с помощью CSS, однако вы хотите:

   .fb_container{ 
       width: 200px; 
   } 
   

4. И тогда вы можете изменить его программно с JS:

   $(".fb_container").css("width","200px"); 
   

Вот working jsFiddle example

Answer 2

Этот код должен сделать трюк:

$('.fb-comments').attr('data-width', '200'); 

Это сделает «.fb-comments» шириной 200 пикселей.

Answer 3

Необходимо обновить три элемента, чтобы полностью изменить размер.

$('.fb-comments').attr('data-width', '200'); 
$('.fb-comments span').css('width', '200'); 
$('.fb-comments span iframe').css('width', '200');