The jquery Dialog Plugins Aerowindow presented today is one of the most personal, because he has a physical body that is the same as the Windows 7 Aero effect.
Effect Chart:
Demo:
Official Demo Local Demo
features
Unique: Title bar reflective effect when window moves
Window buttons: Minimizing, minimizing, maximizing, and closing
Double-click the window title bar to maximize and shrink
active window highlighting
Change window size (resize)
Mouse Drag and Drop window
N Multiple configuration options
Configuration options
Window title
X/y of the starting position of the window
Window size
The smallest window size
Open the available state of the window (minimized, maximized, normal)
Window animations (30 different gorgeous effects)
Window available functions, mouse events and JavaScript calls
In the following compatibility test browser
Internet Explorer 6
Internet Explorer 7
Internet Explorer 8
Firefox 3
Google Browser 4
Apple Safari 4
Opara10
It's very simple to use.
Come on, let's have your existing site Windows displayed in Windows Aero effect.
The easiest way to use it:
Copy Code code as follows:
$ (' #YourContainerDiv '). Aerowindow ({
WindowTitle: ' My i-very cool Aero windows for Web ',
});
Custom configuration:
Copy Code code as follows:
$ (' #YourContainerDiv '). Aerowindow ({
WindowTitle: ' My i-cool Aero windows for Web ',
Windowpositiontop: ' Center ',
Windowpositionleft: ' Center ',
windowwidth:600,
windowheight:400,
WINDOWMINWIDTH:100,
WINDOWMINHEIGHT:100,
WINDOWANIMATIONSPEED:500,
Windowanimation: ' Easeoutcubic ',//animation effect when window is open
Windowresizable:true,
Windowdraggable:true,
Windowminimize:true,
Windowmaximize:false,
Windowclosable:true
});
Contains all the necessary files and presentation files. This version is based on jquery (v1.4.2)
Official Download Address:»aerowindow (v3.5)
Site Download Address: Aerowindow Windows Aero pop-up window based on jquery
Another Life Flow page with the code for using the Aerowindow plug-in
Copy Code code as follows:
JavaScript script
$ (document). Ready (function () {
$ (' #profilactic a '). Click (function () {
var go=$ (this);
$ (' #mywindows '). attr (' src ', go.attr (' href '))
Go.attr (' href ', ' javascript:void (0); ');
$ (' #Firefoxapp '). Aerowindow ({
WindowTitle: ' To the late ' +go.attr (' class '),
Windowpositiontop: ' Center ',
Windowpositionleft: ' Center ',
windowwidth:1000,
WINDOWHEIGHT:500,
Windowanimation: ' Easeoutcubic '
});
$ (' html,body '). Animate ({scrolltop: ' 0px '}, 300);
return false;
});
});
Pop-up window container
<div id=firefoxapp style= "Display:none" >
<iframe style= "border-right-width:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px "id=" MyWindows "height=" 99.5% "src=" "frameborder=" 0 "width=" 100% "></iframe>
<div id=iframehelper></div>
</DIV>
Need a friend to refer to under.
