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

In - Tạo thanh cuộn ngang - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Trình duyệt » Frame » Tạo thanh cuộn ngang
URL: https://www.javascriptbank.com/scrolling-iframe-content-horizontally-index.html

Tạo thanh cuộn ngang © JavaScriptBank.comHiệu ứng sẽ làm cho một frame được cuộn theo phương ngang khi ta rê con trỏ chuột vào các nút.

Phiên bản đầy đủ: jsB@nk » Trình duyệt » Frame » Tạo thanh cuộn ngang
URL: https://www.javascriptbank.com/scrolling-iframe-content-horizontally-index.html



CSS
<style type="text/css">body { font: 14px/1.3 verdana, arial, helvetica, sans-serif }h1 { font-size:18px }a:link { color:#33c }a:visited { color:#339 }iframe { border: 1px dashed #666 }div.arrows { width:200px; text-align:center }div.arrows img { padding:8px }</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">var timer_id;function scroll_iframe(frm,inc,dir) {  if (timer_id) clearTimeout(timer_id);  if (window.frames[frm]) {    if (dir == "v") window.frames[frm].scrollBy(0, inc);    else window.frames[frm].scrollBy(inc, 0);    timer_id = setTimeout("scroll_iframe('" + frm + "'," + inc + ",'" + dir + "')", 20);  }}function stopScroll() { if (timer_id) clearTimeout(timer_id); }</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<iframe name="scr1" id="scr1" scrolling="no" src="scroll_h1.html" width="200" height="80" frameborder="0">Sorry, your browser doesn't support iframes.</iframe><div class="arrows">  <a href="javascript:;" onmouseover="scroll_iframe('scr1', -4, 'h'); window.status='Hover here to scroll left.'; return true" onmouseout="stopScroll(); window.status=''; return true"><img src="tri-lft.gif" width="12" height="12" alt="" border="0"></a>   <a href="javascript:;" onmouseover="scroll_iframe('scr1', 4, 'h'); window.status='Hover here to scroll right.'; return true" onmouseout="stopScroll(); window.status=''; return true"><img src="tri-rt.gif" width="12" height="12" alt="" border="0"></a></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/browser/Scrolling_Iframe_Content_Horizontally/scroll_h1.htmlhttp://javascriptbank.com/javascript/browser/Scrolling_Iframe_Content_Horizontally/tri-lft.gifhttp://javascriptbank.com/javascript/browser/Scrolling_Iframe_Content_Horizontally/tri-rt.gif