Javascript 导致移动设备上出现水平滚动的类似Facebook的按钮

我有一个类似Facebook的按钮实现，在所有桌面和移动浏览器中都能很好地呈现。但问题在于分辨率为240x320的低分辨率设备。Like按钮使设备放大页面，从而呈现水平滚动

在宽度>=320px的设备上，如iPhone等，按钮的效果很好，但宽度小于320px的旧android设备面临问题

在我看来。页面加载正常，然后向Facebook进行服务器调用，然后返回一些参数，将其全部分解。它正在生成一个

。我试图设置

width

和

overflow

CSS参数，但似乎都不起作用。我正在初始化Like按钮，如下所示：

<div id="fb-root">
<!--Facebook begins-->       
        <div class="fb-like" data-href="<%=RedirectURL%>" data-send="false" data-layout="button_count" width="80" data-show-faces="false"></div>
        <!-- ends -->
</div> 

<script>
        window.fbAsyncInit = function () {
            FB.init({ appId: '328982000461228', status: true, cookie: true,
                xfbml: true
            });
            FB.Event.subscribe('edge.create', function (response) {
                ntptEventTag('ev=Social&Action=Method Shared');
            });
        };
        </script>
    <script type="text/javascript">

window.fbAsyninit=函数（）{
init（{appId:'328982000461228'，状态：true，cookie:true，
xfbml：对
});
FB.Event.subscribe（'edge.create'，函数（响应）{
ntptEventTag（“ev=社会和行动=方法共享”）；
});
};

类似Facebook的按钮会自动在页面上生成iframe。尝试使用css或javascript动态设置iframe的宽度。iframe有class=“fb_ltr”。

将like按钮放入div中，并在该div上应用溢出隐藏样式。
UDATE:还可以尝试在html和body标签上设置溢出隐藏（在fb页面标签上会有很大的不同）

您可能还发现一个有用的代码段如下：

<meta name="viewport" content="width=320,user-scalable=false" />
<style type="text/css">
    body {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -webkit-user-modify: none;
        -webkit-highlight: none;
        -webkit-user-select: none;
    }
</style>

身体{
-webkit触摸标注：无；
-webkit用户选择：无；
-webkit用户修改：无；
-webkit亮点：无；
-webkit用户选择：无；
}

您是否检查了同一低分辨率浏览器上的其他常规站点？查看twitter.com，如果滚动条在浏览器中仍然出现问题（我遇到了类似的情况），浏览器全屏的定义总是大于可用宽度，我最终不得不在正文中定义一个特定宽度（320px）的“div”，并在其中转储内容，除了使主体溢出：隐藏检测低分辨率设备，并使用其他更适合它的类似按钮布局

这一点是：

data-layout="box_count" ,

不过，这会占用更多的垂直空间，这很好

• 按钮计数

• 箱数

---

上述解决方案均无效。终于得到了答案。虽然这不是最好的解决方案，但它完成了任务

我将其应用于fb like按钮的父容器：

.socialIcons { display: inline-block; width: 200%; /* for low res androids */ overflow: hidden; margin: 5px 0 5px 10px; }

---

这对我来说是最简单的事情，如果您同时使用以下两种方式，则可以在iOS Safari上使用：

html, body {overflow-x: hidden;}

---

做不到。我尝试通过javascript来实现。但是like按钮会向facebook发出服务器呼叫。如果视口设置为320px，将对低分辨率设备造成问题。不推荐。溢出：隐藏我已经实现了。不工作。