1

我正在尝试为我的项目实现一个模式弹出窗口，我在 jsfiddle 中找到了我想要的。我可以找出他们用于模态的 html 和 css 是什么，但我不知道他们使用的是什么 js？

你能告诉我他们在模态中使用什么 javascript 吗？那就是当我单击登录按钮时，模式弹出窗口打开

http://jsfiddle.net/VSsLC/

http://jsfiddle.net/VSsLC/embedded/result/

这是下面的html代码

<div class="modal hide fade" id="login-modal" style="display: none;">
    <a class="close" data-dismiss="modal">×</a>
    <h1>Log in to Kippt</h1>

    <form class="connect-button" name="login" method="post" action="/social/twitter/redirect/" id="twitter-connect-form">
    <div style="display:none"><input type="hidden" name="csrfmiddlewaretoken" value="MNH48hjwVMrGUWcpNqIt4qa1nko6RWdo"></div>

    <a href="#" onclick="$('#twitter-connect-form').submit(); return false;" class="signup-twitter signup-btn" id="twitter_button"><i></i>Log in with Twitter</a>
    </form>
    <form class="connect-button" name="login" method="post" action="/social/facebook/redirect/" id="facebook-connect-form">
      <div style="display:none"><input type="hidden" name="csrfmiddlewaretoken" value="MNH48hjwVMrGUWcpNqIt4qa1nko6RWdo"></div>

      <a href="#" onclick="$('#facebook-connect-form').submit(); return false;" class="signup-facebook signup-btn" id="facebook_button"><i></i>Log in  with Facebook</a>
      </form>

      <form action="/login" method="POST" autocomplete="off"><div style="display:none"><input type="hidden" name="csrfmiddlewaretoken" value="MNH48hjwVMrGUWcpNqIt4qa1nko6RWdo"></div>

        <fieldset>
            <h5>or with Kippt account</h5>
            <input type="text" placeholder="Username or email" name="username" maxlength="30" id="id_username">
            <input type="password" placeholder="Password" name="password" id="id_password">
            <input type="submit" value="Log in" class="btn">
        </fieldset>
         <a href="/accounts/password/reset/"><span>Forgot password?</span></a> · <a href="/signup/"><span>Sign up to Kippt</span></a>
     </form>
</div>
4

2 回答 2

0

您可以将直接链接发布到https://kippt.com/网站，询问他们如何创建注册表单。
很明显，他们的 Javascript 过于模糊，无法理解任何有用的东西，但我确实看到他们使用jQuery。通过做一个小的google搜索，我发现有一个非常相似的效果库，叫做bootstrap modal。
您必须考虑他们使用 jQuery 为自己编写此效果的可能性。

于 2013-02-26T23:35:22.053 回答
0

你的问题不是很清楚，但如果我很好理解，你正在寻找 js 文件。因此，您可以使用大量开发人员工具（chrome、firefox、safari）访问任何浏览器。例如，在 Chrome 中，进入开发者工具，显示控制台（在 mac 上为 cmd+option+i），进入 resssources/Frames/Scripts，您会找到 js 文件

于 2013-02-26T23:39:39.543 回答