修改滚动方向 [英] Modify scroll direction

问题描述

所以基本上，我创建一个分为两列的网站。这些列是浏览器的整体高度，单独填满屏幕的50％。基本示例：

  ------------- 
 | | | 
 | up | down | 
 | | | 
 ------------- 
  

我设计这个。每个列都是一个div，并且都垂直滚动。我想要的是能够滚动任何一个div，右侧的滚动方向与左边的滚动方向相反;但它们同时滚动。

我也想在右边的一个滚动条（像一个正常的垂直网站），但当你滚动，一边

任何人都能在这里协助吗？

http://buero-buero.org/

解决方案

由您链接的网页无耻地偷去，这很平常：

 < script> 
 function crisscross（）{
 $（'down-left'）。style.bottom =' - '+ window.scrollY +'px'; 
 $（'down-right'）。style.bottom =' - '+ window.scrollY +'px'; 
 $（'left'）。style.left =' - '+ window.scrollY +'px'; 
 $（'right'）。style.right =' - '+ window.scrollY +'px'; 
} 
< / script> 
   
 
 
 
 编辑：
 
 
 
回答您的评论：
 
 
 
 A） window.scrollY 是页面的垂直滚动量，你只是绝对地定位你的 #down  div与反向绝对位置。如果你不明白它，你至少应该弄一会儿理解它，或者更好地了解如何 window.scrollY 和jquery  $（）。style 工作。
 
 
 
 B）这不是你可以把积分的代码量...它不偷， 
 
 
 
 C）没有得到点，对不起，＃down-right 你在询问你的问题： div 在滚动条的相反方向滚动。
 
 
 
 编辑
：
 
 
 >  div＃down-right {
 bottom：0; 
 position：fixed; 
 right：6％; 
} 
  
 
So basically, I'm creating a site that thats split into two columns. These columns are go the entre height of the browser and individually fill up 50% of the screen. Basic example:
 -------------
|      |      |
|  up  | down |
|      |      |
 -------------
I've designed this. Each column is a div and both scroll vertically. What I want is to be able to scroll either div and the scroll direction on the right goes the opposite way to the one on the left; but they scroll at the same time.

I'd also like a single scrollbar on the right (like a normal vertical site) but when you scroll that, one side goes up and the other side goes down.

Is anyone able to assist here? Or point me into a particular direction?

Example:
http://buero-buero.org/
解决方案
Shamelessly stolen by the page you link, it's quite trivial:
<script>
function crisscross() {
$('down-left').style.bottom = '-' + window.scrollY + 'px';
$('down-right').style.bottom = '-' + window.scrollY + 'px';
$('left').style.left = '-' + window.scrollY + 'px';
$('right').style.right = '-' + window.scrollY + 'px';
}
</script> 
Edit:

Answering your comment:

A) window.scrollY is the amount of vertical scroll of the page, you just absolute position your #down div with a reverse absolute position. If you don't understand it you should at least mess with it for a while to understand it or, better, learn how window.scrollY and jquery $().style work.

B) It's not the amount of code you can put credits on... it's not stealing but simply not reinventing the wheel.

C) Don't get the point, sorry, #down-right is what you are asking in your question: a div scrolling in the opposite direction of the scrollbar.

Edit again:

Don't forget to give a look at css too:
div#down-right {
    bottom: 0;
    position: fixed;
    right: 6%;
}


                        
这篇关于修改滚动方向的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！