模态框初步认识

party_bid下的第四张卡应用到了模态框，因为没有接触过这个，所以去网上查了一下，Modals就是一个样式，丰富用户体验。首先需要引入三个文件：bootstrap.css、jquery、bootstrap.js,然后在haml里面写入代码

.modal.fade#myModalSucceed//定义id，并且让模态框退色及是页面颜色变暗
  .modal-dialog//引入对话框
    .modal-content//写入内容
      .modal-header
        %button(type="button" class="close" data-dismiss="modal" aria-hidden="true") &times
        .modal-title.question_size
      .modal-body
        %div(style='text-align:center')
          %div
            %h4
              竞价成功
      .modal-footer
        %h4.text-center(style="font-size: 30px" )
          竞价结果

然后在controller里面控制合适显示合适隐藏

 $timeout(function () {
     $('#myModalSucceed').modal('show');//将指定的内容作为模态框自动打开。
     $timeout(function () {
            竞价结果；//模态框隐藏后显示
         $('#myModalSucceed').modal('hide');//将指定的内容作为模态框3秒后自动隐藏。
               }, 3000)
            }, 1)

  注意：模态框不允许重叠，想显示多个模态框，必须重新写代码。我有两种情况显示模态框，所以就写了两个。