Önyükleme Araç İpucu Eklentisi
Araç İpucu Eklentisi
Araç ipucu eklentisi, kullanıcı fare imlecini bir öğenin üzerine getirdiğinde görünen küçük bir açılır kutudur:
İpucu: Eklentiler ayrı ayrı (Bootstrap'in bireysel "tooltip.js" dosyası kullanılarak) veya tümü bir kerede ("bootstrap.js" veya "bootstrap.min.js" kullanılarak) dahil edilebilir.
Araç İpucu Nasıl Oluşturulur
Bir araç ipucu oluşturmak için data-toggle="tooltip"
niteliği bir öğeye ekleyin.
titleAraç ipucu içinde görüntülenmesi gereken metni belirtmek için özniteliği kullanın :
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
Not: Araç ipuçları jQuery ile başlatılmalıdır: belirtilen öğeyi seçin ve tooltip()yöntemi çağırın.
Aşağıdaki kod, belgedeki tüm araç ipuçlarını etkinleştirecektir:
Örnek
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Konumlandırma İpuçları
Varsayılan olarak, araç ipucu öğenin üstünde görünecektir.
data-placementAraç ipucunun konumunu öğenin üstünde, altında, solunda veya sağında ayarlamak için özniteliği kullanın :
Örnek
<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>
İpucu:data-placement Özniteliği " " değeriyle de kullanabilirsiniz; autobu, tarayıcının araç ipucunun konumuna karar vermesine olanak tanır. Örneğin, değer " auto left" ise, araç ipucu mümkün olduğunda sol tarafta, aksi takdirde sağda görüntülenecektir.
Eksiksiz Bootstrap Araç İpucu Referansı
Tüm araç ipucu seçenekleri, yöntemleri ve etkinliklerinin eksiksiz bir referansı için Bootstrap JS Araç İpucu Referansımıza gidin .