如何在工具提示的標題中添加圖像？

我想添加圖像的文字按鈕的標題.. 我已經嘗試添加圖像通過使用下面的PHP代碼title =「」。如何在工具提示的標題中添加圖像？

<?php echo"<img class='file-attach'  src='".get_template_directory_uri()."/images/file-attachment.png'/>"; ?> 

<button type="button" class="btn btn-default tooltip-buttons" data-toggle="tooltip" data-placement="top" title="Here you'll see">?</button>

來源

2016-01-21 anis mumtaz

使用本地'提供title'屬性，不，你不能這樣做。如果您需要支持圖片的圖片，則必須實施自定義圖片。 –

http://stackoverflow.com/questions/15274123/how-do-you-add-an-image-to-a-jquery-tooltip –

請參閱此鏈接可能會解決您的問題http://stackoverflow.com/questions/15274123 /怎麼辦 - 你 - 附加的圖像對A-jQuery的工具提示 –

我實現與圖片的工具提示類似以假亂真，這裏是代碼：

$("[ctitle]").hover(
    function(e) { 
    $("<div id='txt'>").css({ 
     "display": "none", 
     "width": "auto", 
     "height": "auto", 
     "color": "#767676", 
     "border": "solid 1px #767676", 
     "font-size": "12px", 
     "font-family": "Arial", 
     "position": "absolute", 
     "padding": "2px 3px 2px 3px", 
     "background-color": "white", 
     "box-shadow": "3px 3px 1px gray", 
     "left": 0, 
     "top": 0 
    }).appendTo("body").html($(this).attr('ctitle')).stop().fadeToggle().css({ 
     "top": e.pageY, 
     "left": e.pageX 
    }); 

    }, 
    function() { 
    $("[id='txt']").stop().fadeToggle(function(){ 
      $(this).remove(); 
     }) 
    } 
);

基本上代碼添加到您的網頁（包括JQuery的），並使用ctitle代替title。在ctitle屬性中，您可以添加其他HTML代碼進行格式化。

Here is the JSFiddle demo

來源

2016-01-21 11:12:31

如何在工具提示的標題中添加圖像？

回答

相關問題