jquery - 无法让leanModal工作

我试图了解leanModal的工作原理，但似乎无法弄清楚。我从他们的站点http://leanmodal.finelysliced.com.au/?#进行了设置。但是，我不知道该怎么做第3步。

我已经在我的html文件中设置了此功能:

<script type="text/javascript">
     $('#btnToCreate-Join').click(function() {
          $("#trigger_id").leanModal();
     });
</script>

第3步说“如下所述，在模态触发器上调用该函数。请确保将触发器 anchor 的href属性设置为与目标元素的ID相匹配。”

我假设模式触发器是我想要单击以调出窗口的按钮。我不确定第二句话是什么意思。谢谢您的帮助!

最佳答案

This is a sample pen demo for you.
您的html应该是这样的:

<a id="go" name="test" href="#test">Basic</a>

<div id="test">
     bla bla bla
</div>

您的CSS应该是这样的:

#lean_overlay {
    position: fixed;
    z-index:100;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
}

#test {
width: 600px;
padding: 30px;
display: none;
background: #FFF;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0px 0px 4px rgba(0,0,0,0.7);
-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.7);
-moz-box-shadow: 0 0px 4px rgba(0,0,0,0.7);
}

您的JavaScript应该是这样的:
我假设您已经在文档头中引用了leanmodal脚本，并且在浏览器的控制台中没有出现任何错误。

<script type="text/javascript">
  $("#go").leanModal();
</script>