Captain Comic
Captain Comic

Reputation: 16196

How to create popup window(modal dialog box) in HTML

On my web site a have a page where where user can ask questions. Now I want to add Add Image button that must invoke kinda modal dialog box where user needs to upload the picture from computer. Then window is closed and link to image is placed back to post.

I wanna do something similar like in SO https://stackoverflow.com/questions/ask - try pressing Image button and u'll see nice popup window coming up.

Please suggest what is best way to implement that stuff. I am asking for code snippet rather about technology

Upvotes: 0

Views: 15322

Answers (4)

Ashwin Krishnamurthy
Ashwin Krishnamurthy

Reputation: 3758

Perhaps this could be of some help once you have started http://jqueryui.com/demos/dialog/#modal-form. Other wise you can use the DOM structure and create each and every element using appendChild and CreateElement and use css to give a good look.

Upvotes: 3

Mohammad Efazati
Mohammad Efazati

Reputation: 4910

easy as drink water ;)

with jquery create pop up ... like this ( http://fancybox.net/ ) and then add form to pop up for upload image ... then when file uploaded only return absolute address to parent editor ... now you can show your image ;)

Upvotes: 1

Matt
Matt

Reputation: 3848

You will need client side scripting. I reccomend learning Javascript, then Jquery, then Jquery UI. If you know php it should not be too dificult to pickup the basics.

Upvotes: 0

sushil bharwani
sushil bharwani

Reputation: 30187

That popup window you can do by using any jQuery Library like colorbox. For image upload thing you will have to alternately look for some Flash Based or Java based uploads.

http://colorpowered.com/colorbox/core/example1/index.html http://swfupload.org/

Upvotes: 1

Related Questions