Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 712
  • Last Modified:

opening a popup window and animate it

Hi, i want to open a div as a popup window and i want that when i click the click, it should give an animate effect to open, like

it should start from middle and expand to its width, or a slidedown or slideup effect or flip effect.

how this can be achieved, i m scratching my head from last couple of hours could not get it done
0
Gurpreet Singh Randhawa
Asked:
Gurpreet Singh Randhawa
  • 2
  • 2
  • 2
  • +1
1 Solution
 
PeteEngineerCommented:
0
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
that is good, but what about the animation i asked, how i make it look fancy
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
MrunalCommented:
Hi,
You can use show option with different values for jQuery Dialog.
Like:

$('#dialog').dialog({
autoOpen: false,
show: 'blind',
hide: 'explode'
});

Open in new window


Here is reference:

http://jquery-ui.googlecode.com/svn/trunk/demos/dialog/animated.html

http://jqueryui.com/demos/dialog/#option-show
0
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
Good Thanks, But i cannot use UI

just a simpledialog using the javascript or jquery and then animate it
0
 
MrunalCommented:
Hi, If you not wishing to use UI, then you have to manually manage those all things...

Steps:
1. On document ready, bind click event to trigger to open popup.
2. From this JavaScript function, do followings:
-> Make that DIV as centered (using CSS)
-> Make it visible.

Here is reference:

http://yensdesign.com/tutorials/popupjquery/

Another example:

http://stackoverflow.com/questions/1328723/how-to-generate-a-simple-popup-using-jquery
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
  • 2
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now