[Hỏi đáp] How to pop up a html form using jquery

I have made a project using simple HTML page for choosing a category to create new topic. http://www.bdtipsntricks.com/h43-create-new-post

There is a image like in my homepage, after clicking this image a user will redirect that html form page.

But I want to make it modal pop up. I mean clicking o the image, a stylish window will open in pop up to choose category. Please help. Here is a mpdal pop up example http://leanmodal.finelysliced.com.au/

Thanks

If you want to open a new window browser, use this http://www.w3schools.com/jsref/met_win_open.asp
If you want to make an element, when you click the image and that element will be shown, use .click() function to make it shown. Before that, use .load() to load the html into that element

I have made a demo : http://www.bdtipsntricks.com/h49-nnnnn
But it's not working on my homepage: http://www.bdtipsntricks.com/

Pleas, help

You have this script running?

Code:


$(document).ready(function(){
    // show popup when you click on the link
    $('.show-popup').click(function(event){
        event.preventDefault(); // disable normal link function so that it doesn't refresh the page
        var docHeight = $(document).height(); //grab the height of the page
        var scrollTop = $(window).scrollTop(); //grab the px value from the top of the page to where you're scrolling     
        $('.overlay-bg').show().css({'height' : docHeight}); //display your popup and set height to the page height
        $('.overlay-content').css({'top': scrollTop+20+'px'}); //set the content 20px from the window top 
    });
 
    // hide popup when user clicks on close button
    $('.close-btn').click(function(){
        $('.overlay-bg').hide(); // hide the overlay
    });
 
    // hides the popup if user clicks anywhere outside the container
    $('.overlay-bg').click(function(){
        $('.overlay-bg').hide();
    })
    // prevents the overlay from closing if user clicks inside the popup overlay
    $('.overlay-content').click(function(){
        return false;
    });
 
  });

I think the script is running


But, I don't know where is the problem.

Code:

$('.overlay-bg').click(function(){
        $('.overlay-bg').hide();
    })

A semicolon is missing

Oh my God! That's a simple mistake. It's working now. Solved.!!! Thanks NCat