Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Bảng » Khung trượt khi rê chuột vào nút
URL: https://www.javascriptbank.com/crossbrowser-mouseover-scroll-buttons.html
Hiệu ứng sẽ làm cho nội dung của bảng được chỉ định sẽ trượt lên/ xuống khi ta rê con trỏ chuột vào hai nút Up/Down.
Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Bảng » Khung trượt khi rê chuột vào nút
URL: https://www.javascriptbank.com/crossbrowser-mouseover-scroll-buttons.html
<style type="text/css">body { overflow:hidden;}.button { background:#963; position:relative; margin:4px; padding:1px; width:30px; height:30px; border:1px solid #663;}#upButton { border-top:3px solid #663;}#dnButton { border-bottom:3px solid #663;}</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">window.onload = function(){ if (window.winOnLoad) window.winOnLoad();}</script><script type="text/javascript">function winOnLoad(){ var lc = xGetElementById('leftColumn'); if (lc && xDef(lc.style, lc.offsetLeft, lc.offsetTop)) { // downgrade check //lc.slideLinear = true; // this feature will be supported in X v3.15.3 xMoveTo(lc, lc.offsetLeft, lc.offsetTop); // prime the element's inline style properties lc.slideTop = lc.offsetTop; lc.slideLeft = lc.offsetLeft; var e = xGetElementById('upButton'); e.scrlUp = true; e.scrlEle = lc; e.onmouseover = scrlOnMouseover; e.onmouseout = scrlOnMouseout; e = xGetElementById('dnButton'); e.scrlEle = lc; e.onmouseover = scrlOnMouseover; e.onmouseout = scrlOnMouseout; }}function scrlOnMouseover(){ var st, y, minST, maxST; if (this.scrlUp) { minST = 1000; maxST = 6000; y = this.scrlEle.slideTop; } else { minST = 6000; maxST = 1000; y = -xHeight(this.scrlEle); } st = parseInt(xLinearScale(-xTop(this.scrlEle), this.scrlEle.slideTop, xHeight(this.scrlEle), minST, maxST)); xSlideTo(this.scrlEle, this.scrlEle.slideLeft, y, st);}function scrlOnMouseout(){ this.scrlEle.stop = true;}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<div class="collapsible"><div id="upButton" class="button">Up</div><div id="dnButton" class="button"><br>Dn</div></div><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/form/crossbrowser/x_core.jshttp://javascriptbank.com/javascript/form/crossbrowser/x_slide.jshttp://javascriptbank.com/javascript/form/crossbrowser/x_misc.js