jquery - Facebook 点赞框 : changing the width by jQuery

标签 jquery facebook facebook-like

我正在构建这个网站,我决定在侧边栏中放置一个类似 facebook 的框。该网站有 2 种分辨率,具体取决于窗口宽度。根据加载的 CSS,侧边栏的大小将会改变。

在大 css 中,我想要 facebook like 框 410px 宽,在小 css 中,我想要 facebook like 框 200px 宽。

现在我对 jquery 并不那么了不起,所以如果有人能帮助我如何做到这一点,我将非常感激。我想要做的一个例子可以在 http://net.tutsplus.com 上看到。

到目前为止我的情况是这样的:

    <div class="block facebookLikeBox">

    </div>

    $(window).resize(function(){
    if ($(window).width() > 1200) {
        $('.facebookLikeBox').html('<fb:like-box href="http://www.facebook.com/pages/TheFinishedBox/191240420888444" width="410" show_faces="true" stream="false" header="true"></fb:like-box>');  
        }
    }
    else {
        $('.facebookLikeBox').html('<fb:like-box href="http://www.facebook.com/pages/TheFinishedBox/191240420888444" width="200" show_faces="true" stream="false" header="true"></fb:like-box>'); 
    }
}).trigger('resize'); 

我脑子里有这个

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>

不太确定在这里做什么,因为它没有加载任何内容。

编辑:

function adjustStyle(width) {
    width = parseInt(width);
    if (width > 1024) {
        $('#sidebar .tip').addClass('vertical');
        $('.facebookLikeBox').html('<fb:like-box href="http://www.facebook.com/pages/TheFinishedBox/191240420888444" width="410" show_faces="true" stream="false" header="true"></fb:like-box>');
        FB.FBXML.parse(document.getElementsByClassName('.facebookLikeBox')); 
   } else {
       $('#sidebar .tip').removeClass('vertical');
       $('.facebookLikeBox').html('<fb:like-box href="http://www.facebook.com/pages/TheFinishedBox/191240420888444" width="200" show_faces="true" stream="false" header="true"></fb:like-box>');
        FB.FBXML.parse(document.getElementsByClassName('.facebookLikeBox')); 
    }
}

$(function() {
    adjustStyle($(this).width());
    $(window).resize(function() {
        adjustStyle($(this).width());
    });
});



<head><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script></head>

如果您好奇的话,这里有一个更新:这里是实时更新:http://thefinishedbox.com

最佳答案

我有一些类似的问题..但是你可以更轻松地解决它:)你尝试过在脚本末尾调用它吗?

FB.XFBML.parse(document.getElementsByClassName('.facebookLikeBox'));    

这可能会有所帮助..

当然你必须加载 javascript SDK..:)

关于jquery - Facebook 点赞框 : changing the width by jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4913403/

相关文章:

Jquery - 如何检查类名是否存在

javascript - 使用 JS - jQuery,如何取消转义 html 并将 `quotes & <>` 放回字符串中?

facebook - 此应用已被货币化 : The app you're attempting to add is already being monetized by a business in Facebook audience network?

facebook - 如何在 Facebook 上发布内容,就像 Spotify 对音乐所做的那样

javascript - 如何制作大型自定义社交媒体按钮

javascript - 在新行 AJAX 中显示 JSON 结果

javascript - 如何使用 Facebook 对 Cognito 的 API 调用进行身份验证?

php - 将 CSS 应用于 Iframe 内容

javascript - 将 facebook Like 按钮附加到 div 中

javascript - 如何在view mvc razor asp.net中使用jquery真人?