Home » Tooltips
Keranjang Belanja Anda
Jumlah Barang : pcs
Jumlah Nama Barang Total
0 Rp 0,00
keranjang anda kosong

* Klik tombol di bawah ini untuk menyelesaikan pemesanan.

Tooltips

Tooltips are a quick way to provide [tooltip align=”tip-bottom” text=”extended information” ]Tooltips are awesome, you should totally use them[/tooltip] on a term or action on a page.

Building With HTML Classes

Tooltips work cross browser and cross platform and are easily added to a page with a simple markup and class structure. You can apply the has-tip class to any element.

By default, the tooltip takes the width of the element that it is applied to, but you can override this behavior by applying a data-width attribute to the target element. The tooltip takes on the content of the targets title attribute.

The tooltips can be positioned on the [tooltip align=”tip-bottom” text=”tip-bottom” ]I’m on bottom and the default position[/tooltip], which is the default position, [tooltip align=”tip-top” text=”tip-top” (hehe)” ]I’m on the top and I’m not rounded[/tooltip], [tooltip align=”tip-left” text=”tip-left” ]I’m on the left[/tooltip], or [tooltip align=”tip-right” text=”tip-right” ]I’m on the tight[/tooltip] of the target element by adding the appropriate class to them. You can even add your own custom class to style each tip differently. On a small device, the tooltips are full width and bottom aligned.
[alert ]Remember: This tooltips with external link are not working on touch devices.[/alert]

Available class options:
tip-top: Align the tip above the element you attach it to.
tip-bottom: Align the tip below the element you attach it to.
tip-left: Align the tip to the left the element you attach it to.
tip-right: Align the tip to the right the element you attach it to.

Smallipop – A versatile jQuery plugin for displaying beautiful tooltips and interactive tours

Tulis komentar Anda tentang Tooltips