i have this jquery popup but i need to show it only in the homepage. Here is the code:





This is the CSS:



position:fixed; background:#000; width:100%; height:100%; opacity: .6 display:none; }


position:absolute; width:600px; height:836px; background:#eeeeee; left:50%; top:50%; border-radius:5px; padding:10px 0; margin-left:-300px; /* width/2 + padding-left / margin-top:-418px; / height/2 + padding-top */ text-align:center; box-shadow:0 0 10px 0 #000; z-index: 9999; display:none; }


position:absolute; background:black; color:white; right:-15px; top:-15px; border-radius:50%; width:30px; height:30px; line-height:30px; text-align:center; font-size:8px; font-weight:bold; font-family:'Arial Black', Arial, sans-serif; cursor:pointer; box-shadow:0 0 10px 0 #000; }

Thanks in advance.

  • What do you mean by "show"? Your current code adds 2 click listeners, it shouldn't show anything by default
    – kero
    Commented Dec 5, 2019 at 13:47
  • I am very bad at javascript, sorry! Still have much to learn. Here is the link to the website homepage: www33.ecoar.com.br Commented Dec 5, 2019 at 13:57
  • How the popup is working? Is it a plugin? Commented Dec 5, 2019 at 14:43
  • I got the script from this link: quora.com/… Commented Dec 5, 2019 at 14:56

1 Answer 1


The first thing you need to do is add display:none; to your CSS for both #thover & #tpopup so they are hidden by default.

Next you will want to use JS to find the URL of the page you are on and store this in a variable you can test against to determine if the pop-up should show.

Add the following to the jQuery function:

const pageURL = window.location.href;

Wrap everything else you already have in a conditional that checks if the page is Home:

if (pageURL === 'http://www33.ecoar.com.br/'){

Inside the conditional, add the following line of jQuery to show the pop-up when true:

jQuery("#tpopup, #thover").show();

The new completed JS for 'popup.js' will be:

   jQuery(document).ready(function () {
    const pageURL = window.location.href;
        if (pageURL === 'http://www33.ecoar.com.br/') {
            jQuery("#tpopup, #thover").show();
            jQuery("#thover").click(function () {
            jQuery("#tclose").click(function () {
  • Many thanks for your help. It was a great idea to get the url. I would never thought of that. I followed your instructions, but i am getting a weird page when i set the css to display: none and in the other pages fo the site, i cant close the popup. I am going to edit the question to show the css. Commented Dec 6, 2019 at 11:46
  • Hm, looks like in the #thover selector you are missing a semicolon after opacity: .6 try #thover{ position:fixed; background:#000; width:100%; height:100%; opacity: .6; display:none; }
    – Anthony D
    Commented Dec 6, 2019 at 14:35
  • Man, youre right! Didnt see it. Thanks a lot for your help. Saved my ass :D. How can i get better at Javascript? I know it is annoying to ask for help so very often. Commented Dec 6, 2019 at 17:15
  • The more you work with a language, the more it sticks with you. Finding projects to work on to get your "practice" can be challenging when you're starting out. So I would recommend trying an online course that includes projects. Not only does it teach you the basics of the language, but it will show you how to put what you've learned to use. I personally recommend this one udemy.com/course/the-complete-javascript-course. Good luck! If you could mark my answer as "Accepted" that would be greatly appreciated. Thanks!
    – Anthony D
    Commented Dec 6, 2019 at 17:54
  • Thanks again! I will do what you suggested. Best regards! Commented Dec 9, 2019 at 11:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.