简体   繁体   中英

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.

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> 

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

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

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM