Question

我有一个价格跟踪网站。这是建立在bootstrap上的。

我试图从各个页面添加类似于弹出框的facebook，但它似乎没有用。

是否有一种简单的方法可以添加像弹出框一样的facebook for bootstrap？

Answer 1

当然认为你所寻找的不是弹出......而是它被称为模态。下面我将简要介绍一下你需要做的事情：

<强> HTML：

<button style="margin:20px;" class="btn" type="button" data-toggle="modal" data-target="#myModal">Launch modal in old way</button>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
 <div class="modal-dialog" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
       <h4 class="modal-title" id="exampleModalLabel">New message</h4>
     </div>
    <div class="modal-body">
      This is a Message
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>
</div>

<button id="newbtn" class="btn btn-primary" type="button">Launch modal in new way</button>

<强> CSS：

.btn:focus,.btn:active:focus,.btn.active:focus,
.btn.focus,.btn:active.focus,.btn.active.focus {
   outline: none;
}

<强> JS：

$("#newbtn").click(function() {
   BootstrapDialog.show({
    title: 'Say-hello dialog',
    message: 'Hello, World!'
    });
  });

请确保添加CDN for bootstrap，你应该全力以赴！取出按钮功能，并将其替换为href标签，以便您点击它，它应该可以正常工作。

Facebook弹出框为html bootstrap网站

1 个答案: