bootstrap tooltip 顯示提示信息


參照網上文檔,是這樣說的,

<a data-toggle="tooltip" data-placement="top" title="這是要提示Tooltip文字">上方的 Tooltip</a>
 
        <script type="text/javascript">
        $(function(){
            var options={
                animation:true,
                trigger:'hover' //觸發tooltip的事件
            }
            $("[data-toggle='tooltip']").tooltip(options);
            //$("[data-toggle='tooltip']").tooltip('show');//指定顯示某一個tooltip//還可取值hide toggle 
        });
 
        // 或者  $(function () { $("[data-toggle='tooltip']").tooltip(); });
 
 // 當想顯示主要內容時,<a data-toggle="tooltip" data-placement="top" title="這是要提示Tooltip文字" data-content='除了定義提示信息的title標題,還要定義主要的內容'>上方的 Tooltip</a>
 //$(function () {
//$("[data-toggle='tooltip']").popover();
 //   })
        </script>
 
但在我使用過程中並未顯示提示文字,查找另一種解決辦法是這樣,就能顯示了,但使用td自動生成了寬度要注意bootsrap td的寬度要保持一致,才不影響使用
 
可應用的寫法:
<td class="tdOfTextLeft" onMouseOver="$(this).tooltip('show')" data-toggle="tooltip" title="這是提示這是提示這是提示這是提示"  data-placement="top">
效果:
 
          
         
參照鏈接:
 
         

http://www.runoob.com/bootstrap/bootstrap-tooltip-plugin.html
http://www.cnblogs.com/Zell-Dinch/p/3888855.html
http://blog.csdn.net/a316212802/article/details/25215491
http://www.educity.cn/wenda/149132.html

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM