Phiên bản đầy đủ: jsB@nk » » Chú thích cho liên kết bằng khung trượt
URL: https://www.javascriptbank.com/tooltips-x-tooltips.html
Hiệu ứng tạo các chú thích cho liên kết nằm trong một khung, khung này sẽ tự động di chuyển từ phía trái ra khi ta rê con trỏ chuột vào liên kết.
Phiên bản đầy đủ: jsB@nk » » Chú thích cho liên kết bằng khung trượt
URL: https://www.javascriptbank.com/tooltips-x-tooltips.html
<style type="text/css">#xTooltip { position:absolute; visibility:hidden;}.tip1 { color:#666; border-bottom:1px dashed #ccc;}.tip2 { color:#66f; border-bottom:1px dashed #ccf;}.tip3 {}.xtip1 { position:absolute; visibility:hidden; overflow:hidden; color:#000; background:#ccc; border:1px solid #666; font-size:10px; margin:0; padding:1px; width:180px; height:14px;}.xtip2 { position:absolute; visibility:hidden; overflow:hidden; color:#008; background:#ccf; border:1px solid #008; font-size:10px; margin:0; padding:1px; width:180px; height:14px;}.xtip3 { position:absolute; visibility:hidden; overflow:hidden; color:#800; background:#fcc; border:1px solid #800; font-size:10px; margin:0; padding:1px; width:180px; height:14px;}</style><link rel="stylesheet" type="text/css" href="s1.css"><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script type="text/javascript" src="xlib.js"></script><script type="text/javascript">xInclude('../x_core.js', '../x_event.js', '../x_dom.js', '../x_slide.js');window.onload = function() { xInitTooltips(3);}function xInitTooltips(n) { var i, j, tips; for (i = 1; i <= n; ++i) { tips = xGetElementsByClassName('tip' + i); for (j = 0; j < tips.length; ++j) { tips[j].isTip = true; tips[j].onmouseover = xttOnMouseover; } } xAddEventListener(document, 'mousemove', xttOnMousemove, false);}function xttOnMouseover(e) { var tt = xGetElementById('xTooltip'); tt.className = 'x' + this.className; tt.innerHTML = this.getAttribute('title'); xMoveTo(tt, -200, xPageY(this) - xHeight(tt) - 2); xShow(tt); xSlideTo(tt, xPageX(this), xPageY(this) - xHeight(tt) - 2, 250);}function xttOnMousemove(e) { var evnt = new xEvent(e); var ele = evnt.target; if (!ele || !ele.isTip) { xHide('xTooltip'); }}</script><script type="text/javascript" src="x_core.js"></script><script type="text/javascript" src="x_event.js"></script><script type="text/javascript" src="x_dom.js"></script><script type="text/javascript" src="x_slide.js"></script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><span class="tip1" title="But I must explain">Sed ut perspiciatis</span>unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui do<a class="tip3" href="http://lipsum.com/" title="Read about Lorem Ipsum at lipsum.com">lorem ipsum</a><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/link/tooltips/s1.csshttp://javascriptbank.com/javascript/link/tooltips/x_core.jshttp://javascriptbank.com/javascript/link/tooltips/x_event.jshttp://javascriptbank.com/javascript/link/tooltips/x_dom.jshttp://javascriptbank.com/javascript/link/tooltips/x_slide.jshttp://javascriptbank.com/javascript/link/tooltips/xlib.js