1

我正在开发一个第三方应用程序，该应用程序旨在对其将要放置的站点进行响应。此“小部件”将放置在通常无响应的站点上。我正在使用 CSS 媒体查询来检测屏幕尺寸，如下所示：

@media only screen and (min-device-width : 320px) and (max-width: 800px) {
  /* STYLES */
}

并且还检测移动浏览器以触发各种特定于移动的 JavaScript 函数，例如：

 var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);

 if(isMobile) {
   // Do Something
 }

当我在发布者的响应式站点上测试这些样式和功能时，它们工作得很好，但在将小部件放置在非响应式站点上时不执行（默认为桌面样式和 JS）。我可以让无响应的网站正常运行的唯一方法是插入以下元标记来限制发布者页面的缩放：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

理想情况下，我不会限制发布小部件的无响应移动网站上的浏览器缩放。我能做些什么来避免添加这个标签吗？

一般来说，我可以做些什么来确保我的特定于移动设备的样式和 JS 在放置在非响应式发布者的网站上时正确运行？

非常感谢您的帮助。

4

0 回答 0