2017-06-29 13 views

答えて

0

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <title>jQuery UI Tooltip - Default functionality</title> 
 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
    <script> 
 
    $(function() { 
 
    $(document).tooltip(); 
 
    }); 
 
    </script> 
 
    <style> 
 
    label { 
 
    display: inline-block; 
 
    width: 5em; 
 
    } 
 
    </style> 
 
</head> 
 
<body> 
 
    
 

 
<p><label for="age">Your age:</label><input id="age" title="We ask for your age only for statistical purposes."></p> 
 
<p>Hover the field to see the tooltip.</p> 
 
    
 
    
 
</body> 
 
</html>

$(document).tooltip(); 

は、このリンクを参照してください。マウスオーバーが楽しいction。単にボタンにツールチップを添付してください。

$('.navbar-btn').tooltip({ 
    items: "button", 
    content: ".", 
    open: function() { 
    $(this).tooltip("option", "content", $(this).text()); 
    } 
}); 
0

になります試してみてください

https://jqueryui.com/tooltip/ :コードは次のようである、

$('.navbar-btn').mouseover(function() { 
     $(this).tooltip({ 
      trigger: 'hover', 
      delay: { 
       show: 200 
      }, 
      title : $(this).text() 
     }); 
    }); 
関連する問題