title: MaterializeCSS modal is opened without any click event
body: <p>I have used the same example from materializecss <a href="http://materializecss.com/modals.html" rel="nofollow noreferrer">modal</a>.</p>
  
  <p>The problem here modal is opened before the click event from anchor.</p>
  
  <pre><code>&lt;a class="modal-trigger" href="#modal1"&gt;Specialization&lt;/a&gt;
  &lt;div id="modal1" class="modal"&gt;
    &lt;div class="modal-content"&gt;
      &lt;h4&gt;Modal Header&lt;/h4&gt;
      &lt;p&gt;A bunch of text&lt;/p&gt;
    &lt;/div&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I have added the JavaScript code :</p>
  
  <pre><code>$(document).ready(function(){
        // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
        $('.modal-trigger').leanModal({
            dismissible: true, // Modal can be dismissed by clicking outside of the modal
            opacity: .5, // Opacity of modal background
            in_duration: 300, // Transition in duration
            out_duration: 200, // Transition out duration
        });
  });
  </code></pre>
  
  <p>1st image is where modal opens up before the modal-trigger event
  <a href="https://i.stack.imgur.com/IOuo5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/IOuo5.png" alt="1st image is where modal opens up before the modal-trigger event"></a>
  2nd image on click event of modal-triger</p>
  
  <p><a href="https://i.stack.imgur.com/6Ixkq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6Ixkq.png" alt="enter image description here"></a></p>