1

我有一个移动网站使用

<meta name = "viewport" content = "width = 320">
<meta content='width = 320; initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />

设置网站的宽度以适应并禁止人们放大。

现在我还有 2 个 div，其中 1 个是可见的，第二个应该在用手指向左滑动时滑入。我用于此的 javascript 类似于

var a = 320;
var speed = 10;
function slide(from, to) {
   if (a > 0) {
      from.style.display = "block";
      to.style.display = "block";
      a = a + speed;
      from.style.left = (a - 320) + "px";
      to.style.left = a + "px";
      setTimeout('slide("' + from + '", "' + to + '");', 10);
   } else {
      a = 0;
      from.style.display = "none";
      to.style.display = "block";
   }
}

这确实有效，但是对于某些设备，当您第一次运行它时，网站的比例首先会重置为正常，然后回到设置的 320px 宽度，从而使网站上的其他一些 div 无缘无故地不可见。

有谁知道为什么会发生这种情况以及如何解决这个问题。（我肯定知道它会重新缩放的手机是三星银河的名声）

谢谢，

梅林登霍廷

4

2 回答 2

0

由于我无法发表评论，我将不得不回答这个问题。我不知道移动支持有多远，但您可能想看看 CSS-Animations 并简单地更改类。此外，您可能想尝试绝对定位或相对定位（取决于您当前使用的内容）。您也应该尝试可见性：隐藏或可见属性。也许从块到无的变化会破坏一些东西。因为我没有三星 Galaxy Fame，所以即使您发布 JSFiddle 或类似内容，我也无法检查发生了什么。

于 2013-11-03T01:38:38.533 回答
0

您可以使用 jQuery animate 函数执行此操作，如下所示：

将 div1 滑入

$( "#div1" ).animate({
    left: 0px;
}, 1500 );

将 div2 滑出

$( "#div2" ).animate({
    left: -320px;
}, 1500 );
于 2013-11-03T16:54:27.163 回答