How to set mouseover prompt in bootstrap

1、 　　

<button type="button" rel="drevil" data-content="报名截止时间：&#39;+time+&#39;" data-container="body" data-toggle="popover" 
data-placement="bottom"></button>

2、

$(function () { $("[data-toggle='popover']").popover(); });　　　　
　　  $("[rel=drevil]").popover({
                      trigger:'manual',
                      //placement : 'bottom', //placement of the popover. also can use top, bottom, 
                      left or right
                      //天title : &#39;<div style="text-align:center; color:red; text-decoration:underline; 
                      font-size:14px;"> Muah ha ha</div>&#39;, //this is the top title bar of the popover. 
                      add some basic css
                      html: &#39;true&#39;, //needed to show html of course
                      //content : &#39;<div id="popOverBox"><img src="http://www.hd-report.com/wp-content
                      /uploads/2008/08/mr-evil.jpg" width="251" height="201" /></div>&#39;, //this is the 
                      content of the html box. add the image here or anything you want really.
                      animation: false
                  }).on("mouseenter", function () {
                      var _this = this;
                      $(this).popover("show");
                      $(this).siblings(".popover").on("mouseleave", function () {
                          $(_this).popover(&#39;hide&#39;);
                      });
                  }).on("mouseleave", function () {
                      var _this = this;
                      setTimeout(function () {
                          if (!$(".popover:hover").length) {
                              $(_this).popover("hide")
                          }
                      }, 300);
                  });

Related recommendations: "bootstrap Getting Started Tutorial"

The above is the detailed content of How to set mouseover prompt in bootstrap. For more information, please follow other related articles on the PHP Chinese website!