jQuery window.resizeTo在慢动作 [英] jquery window.resizeTo in Slow Motion

问题描述

我想在慢动作模式下调整窗口大小，但是以下代码不起作用，我也不知道该怎么做:

I want to resize a window in slow motion mode but the following code doesn't work and I have no idea what to do:

var myWindow;

function resize() {
   var windowsHeight = jQuery(window).height();
   var windowsWidth = jQuery(window).width();
   var DivX = windowsWidth - 320;
   var DivY = windowsHeight - 480;
}

myWindow = window.open("/", "", "width=320, height=480"); 
myWindow.resizeTo(windowsHeight, windowsWidth),1000;
myWindow.focus();

推荐答案

在此示例中，您可以看到动画效果.只需根据需要对其进行自定义即可.

In this example you can see the animation effect. Just customize it as you wish.

诀窍是使用带有 jquery.animate 的自定义动画.

The trick is to use a custom animation with jquery.animate.

function pop(){
  var win = window.open("", "Title", "toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=780, height=200, top=0, left=0");
  win.document.body.innerHTML = "HTML";

  $({foo:0}).animate({foo:100}, {
    step: function(val) {
      win.resizeTo(val * 5, val * 5);
    }
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="pop()">Open</button>

注意:出于安全原因，您可以在摘要中看到效果.您可以在我创建的小提琴(jsbin)中看到效果:

Note: You can see the effect within the snippet for a security reason. You can see the effect in the fiddle(jsbin) I created:

http://jsbin.com/fojuva

注释2:我在Google Chrome和Mozila Firefox最新版本中检查了此代码.

Note 2: I checked this code in Google Chrome and Mozila Firefox The latest versions.

这篇关于jQuery window.resizeTo在慢动作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！