How to add a listener with JavaScript

Question

I'm developing a page in Chrome and I want it to show a modal when the user clicks an image but when I try it with my localhost it does nothing. I think there's a problema with a listener. This is my code:

$(document).ready(function() {

  document.getElementByClass(".call-to-action").addEventListener("click", openModal());

});

function openModal() {
  $("html").addClass("modal-open");
}

My CSS:

.modal-open
  .modal
    opacity: 1
    pointer-events: all

Thanks!!

Answer 1

This might help you, cheers!

If you are using Jquery :

 $(document).ready(function() { $(".call-to-action").on("click", openModal); }); function openModal() { $("html").addClass("modal-open"); }

 html.modal-open{ background: #ddd; }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <input class="call-to-action" type="button" value="CTA"/> </body>

If you are using javascript :

 document.getElementsByClassName("call-to-action")[0].addEventListener("click", openModal); function openModal() { document.documentElement.classList.add("modal-open"); }

 html.modal-open { background: #ddd; }

 <body> <input class="call-to-action" type="button" value="CTA" /> </body>

How to add a listener with JavaScript

Question

1 answers

solution1
2 2016-09-06 02:20:20

How to add a listener with JavaScript

Question

1 answers

solution1 2 2016-09-06 02:20:20

solution1
2 2016-09-06 02:20:20