Suraj
Suraj

Reputation: 2563

on click modal is not opening locally

I am trying to work with modal here.

Below is the code of my modal.

<div class="modal-wrapper modal-popup-signup">
        <div class="modal-close modal-popup-signup-close"></div>
        <div class="modal-body">
            <h1>SIGN UP</h1> 
            <form action="" class="password-change">
                <h2>E-MAIL ID*</h2>
                <input type="text" class="text">
                <h2>PASSWORD*</h2>
                <input type="password" class="text">
                <h2>TITLE*</h2>
                <h2>FIRST NAME </h2>
                <input type="text" class="text">
                <h2>LAST NAME </h2>
                <input type="text" class="text">

                <input type="submit" class="submit">
            </form>
        </div>
    </div>

On this li I have a anchor tag where i am opening the Modal.

  <ul>
   <li></li>
   <li></li>
    <li><a href="#"class="modal-popup-signup-open">Signup</a></li>
  </ul>

Here's the JS for it.

  $(document).ready(function(){
        $('.modal-popup-signup-open').click(function(){
            $('.modal-popup-signup').css("display", "block");
        });
  $('.modal-popup-signup-close').click(function(){
          $('.modal-popup-signup').css("display", "none");
        });
  });

The fiddle, It for some reason worked here but not working for me locally.

EDIT ! : I am doing this only for small screen. So when I go to full window size I can see the pop-up. But why not for small screen? Provided I am using proper bootstrap modal.

Upvotes: 1

Views: 84

Answers (2)

Kamlesh Meghwal
Kamlesh Meghwal

Reputation: 4972

To open pop-up:

$('.modal-popup-signup-open').click(function(){
            $('.modal-popup-signup').modal('show');
        });

To close:

$('.modal-popup-signup-close').click(function(){
          $('.modal-popup-signup').modal('hide');
        });

FIDDLE

Upvotes: 1

Swapnil Motewar
Swapnil Motewar

Reputation: 1088

Instead of

$('.modal-popup-signup').css("display", "block");

Use following

$('.modal-popup-signup').modal('show');

for closing of modal use

$('.modal-popup-signup').modal('close');

and also use the href="javascript:void(0)" in anchor tag

Upvotes: 1

Related Questions