[英]Tippy.js - Unable to hide a tooltip using the tippy.js documentation function
我在網站上使用tippy.js作為工具提示,但是到了必須使用功能手動隱藏它們的時候(在移動設備上)。 但是我無法使用內置函數hide()
隱藏它
我做錯什么了嗎?還是庫出錯了?
這是顯示hide()函數的文檔 。 這是我的問題的摘要。
var instance = new Tippy('button') var i = 0; $(document).on('keyup', function() { $('.clickcount').html(i); i++; var popper = instance.getPopperElement(document.querySelector('.tippy-popper')); instance.hide(popper) })
button { margin: 20px; }
<link href="https://atomiks.github.io/tippyjs/tippy/tippy.css" rel="stylesheet" /> <script src="https://atomiks.github.io/tippyjs/tippy/tippy.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button title="text">Button with Tippy</button> <div class="clickcount">Focus the document, then hover the button and press any key to hide it.</div>
任何和所有幫助表示贊賞!
從文檔中 :
通過調用方法
getPopperElement
並直接傳遞元素來查找元素的popper引用:
您需要將元素傳遞給getPopperElement
,而不是彈出窗口。
var instance = new Tippy('button') var i = 0; $(document).on('keyup', function() { $('.clickcount').html(i); i++; var popper = instance.getPopperElement(document.querySelector('button')); instance.hide(popper) })
button { margin: 20px; }
<link href="https://atomiks.github.io/tippyjs/tippy/tippy.css" rel="stylesheet" /> <script src="https://atomiks.github.io/tippyjs/tippy/tippy.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button title="text">Button with Tippy</button> <div class="clickcount">Focus the document, then hover the button and press any key to hide it.</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.