»
Tiếng AnhTiếng PhápTiếng Việt

In - Khung trượt khi rê chuột vào nút - JavaScriptBank.com

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

Khung trượt khi rê chuột vào nút © JavaScriptBank.comHiệ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



CSS
<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-->


JavaScript
<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-->


HTML
<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-->


Files
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