Tooltip Plugin
Wtyczka Etykietka jest małe okienko pop-up, który pojawia się, gdy użytkownik przesuwa wskaźnik myszy nad elementem:
Wskazówka: Wtyczki mogą być użyte pojedynczo (stosując Bootstrap's poszczególne "tooltip.js" pliku) lub wszystkie na raz (za pomocą "bootstrap.js" lub "bootstrap.min.js" ).
Jak utworzyć podpowiedź
Aby utworzyć podpowiedź, dodać data-toggle="tooltip"
atrybutu do elementu.
Użyj title
atrybut określić tekst, który powinien być wyświetlany wewnątrz podpowiedzi:
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
Uwaga: podpowiedzi muszą być inicjowane z jQuery: wybór określonego elementu i wywołać tooltip()
metody.
Poniższy kod pozwoli wszelkie podpowiedzi w dokumencie:
Przykład
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Spróbuj sam " Pozycjonowanie podpowiedzi
Domyślnie podpowiedzi pojawi się w górnej części elementu.
Użyj data-placement
atrybut, aby ustawić pozycję podpowiedzi na górze, na dole, po lewej lub prawej stronie elementu:
Przykład
<a href="#" data-toggle="tooltip" data-placement="top"
title="Hooray!">Hover</a>
<a href="#" data-toggle="tooltip"
data-placement="bottom" title="Hooray!">Hover</a>
<a href="#"
data-toggle="tooltip" data-placement="left" title="Hooray!">Hover</a>
<a
href="#" data-toggle="tooltip" data-placement="right"
title="Hooray!">Hover</a>
Spróbuj sam " Wskazówka: Można również użyć data-placement
atrybut o wartości "auto", która pozwoli przeglądarka zdecyduje pozycję podpowiedzi. Na przykład, jeśli wartość jest "auto left" , tooltip pojawi się po lewej stronie, jeśli to możliwe, w przeciwnym razie po prawej stronie.
Wypełnij Bootstrap Tooltip Reference
Pełną odniesienia wszystkich Tooltip Opcje, metod i zdarzeń, przejdź do naszej Bootstrap JS Tooltip Reference .