移动端注册登录

查看演示立即下载

插件描述：基于materialize开发移动端注册登录

表单集

<div class="row">
    <form class="col s12">
      <div class="row">
        <div class="input-field col s6">
          <input placeholder="占位提示" id="first_name" type="text" class="validate">
          <label for="first_name">姓名</label>
        </div>
        <div class="input-field col s6">
          <input id="last_name" type="text" class="validate">
          <label for="last_name">爱好</label>
        </div>
      </div>
      <div class="row">
        <div class="input-field col s12">
          <input disabled value="我不能输入" id="disabled" type="text" class="validate">
          <label for="disabled">禁用</label>
        </div>
      </div>
      <div class="row">
        <div class="input-field col s12">
          <input id="password" type="password" class="validate">
          <label for="password">密码</label>
        </div>
      </div>
      <div class="row">
        <div class="input-field col s12">
          <input id="email" type="email" class="validate">
          <label for="email">邮件</label>
        </div>
      </div>
      <div class="row">
        <div class="col s12">
          这是一行输入文本:
          <div class="input-field inline">
            <input id="email" type="email" class="validate">
            <label for="email" data-error="wrong" data-success="right">邮件</label>
          </div>
        </div>
      </div>
    </form>
  </div>

弹出

<!-- Modal Trigger -->
  <a class="waves-effect waves-light btn" href="#modal1">模态</a> <!-- Modal Structure -->
  <div id="modal1" class="modal">
    <div class="modal-content">
      <h4>模态标题</h4>
      <p>一堆文本</p>
    </div>
    <div class="modal-footer">
      <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">同意</a>
    </div>
  </div>
  //jQuery 插件初始化使用触发器开启模态:
  $(document).ready(function(){
    // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
    $('.modal').modal();
  });

你也可以通过程序打开模态，下面的代码将使你模态打开。

1	`$('#modal1').modal('open');`

你也可以通过程序关闭模态:

1	`$('#modal1').modal('close');`

特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com

上一个特效： jQuery倾斜页面打开侧边栏菜单
下一个特效： SelectMenu简洁易用多样的菜单解决方案