Tooltip cho website với Tooltipsy
Tooltipsy là plugin của jQuery giúp bạn dễ dàng tạo tooltips cho website của mình.
Khác với những plugin cùng loại, tooltipsy sử dụng rất ít style và các hiệu ứng, nhưng lại cho bạn gần như toàn quyền điểu khiển việc hiển thị cũng như hiệu ứng của tooltips.
Bạn có thể đặt tooltip ở bất kì vị trí nào mình thích, tùy biến hiển thị bằng CSS (việc này cần bạn phải có kiến thức về CSS) và tùy biến các kiểu hiệu ứng hiển thị (animate của jQuery)
Cách sử dụng
Download tooltipsy và thêm file tooltipsy.min.js vào website của bạn bằng cách thêm vào thẻ <head> của HTML như sau:
<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/tooltipsy.min.js"></script>
Vì plugin không đi kèm mã CSS nên bạn phải tự thêm CSS vào website như sau:
.tooltipsy {
padding: 10px;
max-width: 200px;
color: #303030;
background-color: #f5f5b5;
border: 1px solid #deca7e;
}
Cuối cùng là mã HTML và gọi plugin lên làm việc:
<a class="hastip" title="Show me">
<a class="hastip" title="Me too">
<script type="text/javascript">
$('.hastip').tooltipsy();
</script>
Bạn có thích bài viết này?
Neo
Nhìn mặt trời từ năm 1984 nhưng tới tận 2002 mới được thấy cái máy tính đầu tiên của mình. Đầu năm 2007 thì quyết định theo cái nghề cao quý là thiết kế web 
. Hiện mình đang sống tại Hà Nội. Sở thích: làm website và giúp đỡ mọi người phát triển website theo chiều hướng tốt đẹp hơn.