javascript - What is wrong with this MODAL ? -

i work hard follow steps of this modal login, reason i'm getting nowhere! frustrating.

so this webpage i'm working on. followed , it's suppose work.

i briefly point out code snippets:

right on top of page there's css styling:

<style type="text/css">      /** modal window styles **/  #lean_overlay {      position: fixed;      z-index:100;      top: 0px;      left: 0px;      height:100%;      width:100%;      background: #000;      display: none;  }     #loginmodal {    width: 300px;    padding: 15px 20px;    background: #f3f6fa;    -webkit-border-radius: 6px;    -moz-border-radius: 6px;    border-radius: 6px;    -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);    -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);  }     #loginform { /* no default styles */ }     #loginform label { display: block; font-size: 1.1em; font-weight: bold; color: #7c8291; margin-bottom: 3px; }     .txtfield {     display: block;    width: 100%;    padding: 6px 5px;    margin-bottom: 15px;    font-family: 'helvetica neue', helvetica, verdana, sans-serif;    color: #7988a3;    font-size: 1.4em;    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8);    background-color: #fff;    background-image: -webkit-gradient(linear, left top, left bottom, from(#edf3f9), to(#fff));    background-image: -webkit-linear-gradient(top, #edf3f9, #fff);    background-image: -moz-linear-gradient(top, #edf3f9, #fff);    background-image: -ms-linear-gradient(top, #edf3f9, #fff);    background-image: -o-linear-gradient(top, #edf3f9, #fff);    background-image: linear-gradient(top, #edf3f9, #fff);    border: 1px solid;    border-color: #abbce8 #c3cae0 #b9c8ef;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.4);    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.4);    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.4);    -webkit-transition: 0.25s linear;    -moz-transition: 0.25s linear;    transition: 0.25s linear;  }     .txtfield:focus {    outline: none;    color: #525864;    border-color: #84c0ee;    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), 0 0 7px #96c7ec;    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), 0 0 7px #96c7ec;    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), 0 0 7px #96c7ec;  }      </style>

i added header section 2 .js file links associated:

<script type="text/javascript" src="http://examscan.us/shulemberger/wp-includes/js/jquery-1.9.1.min.js">  </script>    <script type="text/javascript" charset="utf-8"   src="http://examscan.us/shulemberger/wp-includes/js/jquery.leanmodal.min.js">  </script>

then, right on top of webpage have link modal:

<li><a  href="#loginmodal" class="flatbtn" id="modaltrigger">sign in</a></li>  				<li><a class="flatbtn" id="modaltrigger" href="#loginmodal">sign up</a></li>  			

and finally, on bottom of page have modal code:

<div id="loginmodal" style="display:none;">      <h1>user login</h1>      <form id="loginform" name="loginform" method="post" action="index.html">        <label for="username">username:</label>        <input type="text" name="username" id="username" class="txtfield" tabindex="1">                <label for="password">password:</label>        <input type="password" name="password" id="password" class="txtfield" tabindex="2">                <div class="center"><input type="submit" name="loginbtn" id="loginbtn" class="flatbtn-blu hidemodal" value="log in" tabindex="3"></div>      </form>    </div>		

well,

http://leanmodal.finelysliced.com.au/ -> how use -> step 3: call function on modal trigger, follows. sure set href attribute of trigger anchor match id of target element.

$("#trigger_id").leanmodal(); 

...or, if want more 1 modal window on same page, add 'rel' attribute triggers, , call function attribute, so:

$("a[rel*=leanmodal]").leanmodal(); 

i don't see instruction in provided code.