Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/402.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
设置div左侧时Javascript重新缩放移动网页_Javascript - Fatal编程技术网

设置div左侧时Javascript重新缩放移动网页

设置div左侧时Javascript重新缩放移动网页,javascript,Javascript,我有一个移动网站使用 <meta name = "viewport" content = "width = 320"> <meta content='width = 320; initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' /> 这是可行的,但对于某些设备,在您第一次运行此功能时,网站的比例首先重置为正常,然后返回到设置的320px宽度,从而使网站上的其他一些div无缘无故不可

我有一个移动网站使用

<meta name = "viewport" content = "width = 320">
<meta content='width = 320; initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
这是可行的,但对于某些设备,在您第一次运行此功能时,网站的比例首先重置为正常,然后返回到设置的320px宽度,从而使网站上的其他一些div无缘无故不可见

有没有人知道为什么会发生这种情况以及如何解决。 我知道的这款手机肯定能进行缩放,它是三星galaxy的名气

谢谢


梅里恩·登·豪廷(Merijn den Houting)

由于我无法发表评论,我不得不回答这个问题。我不知道移动支持有多远,但您可能想看看CSS动画,然后简单地更改类。另外,您可能希望尝试绝对定位,或者相对定位取决于您当前使用的是什么。此外,还应尝试“可见性:隐藏”或“可见”属性。也许从阻塞变为无会破坏某些东西。
因为我没有三星Galaxy的名声,所以即使你发布了一个JSFIDLE或类似的东西,我也无法检查到底发生了什么。

你可以使用jQuery动画功能来实现这一点,如下所示:

将div1滑入 将div2滑出
根据要求,我将创建一个示例页面,我实际使用的是绝对定位,并且我在没有显示的情况下尝试了相同的代码:block;但它仍在做同样的事情。我将研究CSS动画,谢谢。请务必小心浏览器支持,移动浏览器经常过时。
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";
   }
}
$( "#div1" ).animate({
    left: 0px;
}, 1500 );
$( "#div2" ).animate({
    left: -320px;
}, 1500 );