how to implement the comment popup window at dealsea.com?

Question

I came across [check revision history for link] and surprised by its clean design. I am particularly interested in how the site implement the "Add Comment" popup when you click any of the "Add Comments" link under a deal.

My JS knowledge for popup is still at the .. level. Yet this site is using < a class="addcomment">Add Comments only. How does it trigger the popup? I searched its homepage html source and not seeing the case it pre-load the popup then hide and enable it when someone click the "Add Comments" link.

Answer 1

Have a look at jQuery Its a javascript library that has feature and plugins that can achieve this very easily and supports most browsers.

Have a look at the jquery dialog specifically: http://jqueryui.com/demos/dialog/

Answer 2

They are attaching a click event handler via jQuery. If you use your browser's dev tools and use the console, you could execute the following code to view the handlers bound. If you use Firefox and Firebug, you can use Firequery, which adds the .data() data to the dom view.

$(".addcomment").data("events").click

If you look at the external js file and search for "addcomment", you'll see the handler being bound.