1

http://tooltipsy.com/から tooltipsy.min.js をダウンロードし、html ファイルと同じフォルダーに配置しました。これはまったく機能しない私のコードです。なんで？jquery コードをラップして$(document).ready()も役に立ちませんでした。

<html>
<head>
<style>
.tooltipsy {
    padding: 10px;
    max-width: 200px;
    color: #303030;
    background-color: #f5f5b5;
    border: 1px solid #deca7e;
}
</style>
<script type="text/javascript" src="jquery-3.1.1.slim.min.js"></script>
<script type="text/javascript" src="tooltipsy.min.js"></script>

<script type="text/javascript">
$('.hastip').tooltipsy();
</script>

</head>

<body>
<a class="hastip" title="I am the tooltip text">I want a tooltip</a>
</body>

</html>
4

1 に答える 1

0

これは私にとってはうまくいくようです：

タグを追加し<p>て本体を押し下げる必要がありましたが、先端が見えました。

HTML:

<html>
<head>
<style>
.tooltipsy {
    padding: 10px;
    max-width: 200px;
    color: #303030;
    background-color: #f5f5b5;
    border: 1px solid #deca7e;
}
</style>

<script   src="http://code.jquery.com/jquery-3.1.1.min.js"   integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="   crossorigin="anonymous"></script>

<script type="text/javascript">
$(document).ready(function () {
    $('.hastip').tooltipsy();
})

</script>

</head>

<body>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
<a class="hastip" title="Show me">Why don't you work</a>
</body>

</html>

注:私は非スリム バージョンの jQuery を使用しました。これは、このバージョンのほろ酔いが 3.x スリム バージョンの jQuery とうまく連携していないように見えるためです。(スリムなjQueryでtipsyを使用すると、Uncaught TypeError: b.bind is not a functionコンソールにエラーがスローされます。)

于 2016-10-09T14:05:12.947 に答える