Hideki's Code Stock

レスポンシブWebデザイン採用サイトでのzenback利用サポート

ソーシャルボタンとFacebookのコメント欄により問題が発生する。とりあえず以下のコードで対処可能。

ちなみに、個人的にはzenbackは好きではない。

JavaScript

IE8以下はRWD対応にする気がないので除外。

window.jQuery && (function ($) {
    (function () {
        var zb_pcc_checker;

        if (typeof window.attachEvent === "object" || $(window).width() > 480) {
            return;
        }

        zb_pcc_checker = setInterval(function () {
            var loadChekerId,
                loadCheker;

            loadCheker = function () {
                var $target = $("#zenback-facebook-comment");    // 存在調査のため毎回収集しなおす
                if ($target.length) {
                    $target.find(".fb_iframe_widget").removeAttr("width");
                    $target.find(".fb_iframe_widget > span").css("width", "auto");
                }
            };

            if (window.zb_pcc) {
                clearInterval(zb_pcc_checker);
                loadCheckerId = setInterval(loadCheker, 250);
            }
        }, 200);
    }());
}(jQuery));

CSS

zenbackのスタイル付けを上書きするためにくどいセレクタになっている。

#zenback-widget #zenback-social-button .zenback-module-item{
display:inline-block;
*display:inline;
zoom:1;
}