滚动div而不是页面
我在一个网站上有一个灯箱，我正在做一个查看源代码按钮。背景变暗，并且源将出现，但只有在鼠标悬停在特定 div （或在这种情况下 pre $ c> $ c>）。我想能够，例如，我的鼠标在页面的顶部角落，向下滚动，我想要的主要灯箱滚动。有很多代码，所以我使用：
I have a lightbox of sorts on a website I am working on which acts like a "View Source" button. The background goes dark and the source appears but will only scroll if you have your mouse over that particular div (or in this case pre). I want to able to, for example, have my mouse in the top corner of the page and scroll down and I want the main lightbox to scroll. There's loads of code so I've used:
overflow-x: hidden;
overflow-y: scroll;
我相信它需要一些JavaScript或jQuery，但我不知道从哪里。
I'm sure it will require some JavaScript or jQuery, but I've no idea where to being.
当您在此网页上打开时向下滚动并点击查看完整代码。
It's in oporation on this page when you scroll down and click 'View Full Code'.
任何想法？
最直接的方式是： http://jsfiddle.net/pimvdb/Ezvnp/3/。
$('body').bind('mousewheel', function(e) { // on scroll
var $div = $('div');
// set div scroll top offset to current + extra from this scroll
$div.scrollTop($div.scrollTop()
- e.originalEvent.wheelDelta);
return false; // prevent body scrolling
});
要锁定/解锁滚动，您可以使用一个变量， true ，例如： http://jsfiddle.net/pimvdb/Ezvnp/ 4 / 。
To lock/unlock the scrolling, you could use a variable so as to only lock when that variable is true, e.g.: http://jsfiddle.net/pimvdb/Ezvnp/4/.
var locked = true;
$('body').bind('mousewheel', function(e) {
if(locked) {
var $div = $('div');
$div.scrollTop($div.scrollTop()
- e.originalEvent.wheelDelta);
return false;
}
});
$('button').click(function() {
locked = !locked;
});