移动端注册登录

所属分类:UI-布局

 7679  47  查看评论 (4)
移动端注册登录 ie兼容8

表单集

<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();
  });

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

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

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

$('#modal1').modal('close');
相关插件-布局

高端出彩大气宽屏网站模板

全站模版可直接套用
  布局
 11299  177

HTML5响应式模板

jQuery HTML5响应式模板
  布局
 14767  62

jQuery bootstrap响应式网站模板

jQuery bootstrap响应式销售模板全套完整代码,简洁大气。
  布局
 9847  165

基于jQuery bootstrap的网站模板

基于jQuery bootstrap的网站模板,首页可设置网页皮肤颜色
  布局
 11773  184

讨论这个项目(4)回答他人问题或分享插件使用方法奖励jQ币

    老猫 0
    2017/12/11 13:45:47
    老猫 0
    2017/12/11 13:45:11
    せん へきけい 0
    2017/11/3 14:15:02
    不错的
        ☆★☆★☆0
        2017/11/19 18:07:52

        哼好

    回复
取消回复