Phiên bản đầy đủ: jsB@nk » Hình ảnh » Chú thích cho ảnh
URL: https://www.javascriptbank.com/image-tool-tips.html
Đây là một mã khác để tạo chú thích cho ảnh trong một khung khi người dùng rê con trỏ chuột lên ảnh. Tuy nhiên trong đoạn mã JavaScript này, chú thích có sử dụng CSS nên cho ta cảm giác bắt mắt và chuyên nghiệp hơn.
Phiên bản đầy đủ: jsB@nk » Hình ảnh » Chú thích cho ảnh
URL: https://www.javascriptbank.com/image-tool-tips.html
<style type="text/css"><!--#toolTipBox {display: none;padding: 5;font-size: 12px;border: black solid 1px;font-family: verdana;position: absolute; background-color: #ffd038; color: 000000;}--></style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<script type="text/javascript"><!--// Created by: Saul Salvatierra :: http://myarea.com.sapo.pt// with help from Ultimater :: http://ultimiacian.tripod.comvar theObj="";function toolTip(text,me) { theObj=me; theObj.onmousemove=updatePos; document.getElementById('toolTipBox').innerHTML=text; document.getElementById('toolTipBox').style.display="block"; window.onscroll=updatePos;}function updatePos() { var ev=arguments[0]?arguments[0]:event; var x=ev.clientX; var y=ev.clientY; diffX=24; diffY=0; document.getElementById('toolTipBox').style.top = y-2+diffY+document.body.scrollTop+ "px"; document.getElementById('toolTipBox').style.left = x-2+diffX+document.body.scrollLeft+"px"; theObj.onmouseout=hideMe;}function hideMe() { document.getElementById('toolTipBox').style.display="none";}--></script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<span id="toolTipBox" width="200"></span><img src="../../jsbsource/gif_logojsb2.gif" width="150" height="60" border="0" onmouseover="toolTip('Place your tool tip here',this)"><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->