关于html：我似乎无法禁用滚动条

I can't seem to disable the scroll bar

我正在尝试禁用page1上的滚动条，而不是page2。我已经尝试了很多事情，例如溢出：隐藏；隐藏。或调整高度，但我没有运气。

这是JSFiddle：jsfiddle.net/27fJW/94

JS：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

YUI().use('transition', 'node-event-delegate', function (Y) {
var begin = Y.one('#begin');

function toggle(e) {
closeIt(e);
start();
}

function start() {
var node2 = Y.one("#page2");
node2.replaceClass('invis', 'fade-in-effect');
}

function closeIt(e) {
var node1 = Y.one('#page1');
node1.hide(true);
}

begin.on('click', toggle);
});

CSS：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

.invis {

z-index: -1;

opacity:0;

}

#page2 {

position:absolute;

top:10px;

left:10px;

}

.fade-in-effect {

opacity: 1;

transition: opacity 4s linear;

}

HTML：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71

我该怎么做？

的HTML

的CSS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

body{
overflow-y: hidden;
}
.invis {

z-index: -1;

opacity:0;

}

#page2 {

position:absolute;

top:10px;

left:10px;

}

.fade-in-effect {

opacity: 1;

transition: opacity 4s linear;

}

Java脚本

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

YUI().use('transition', 'node-event-delegate', function (Y) {
var begin = Y.one('#begin');

function toggle(e) {
closeIt(e);
start();
}

function start() {
var node2 = Y.one("#page2");
node2.replaceClass('invis', 'fade-in-effect');
document.body.style.overflow ="auto";
}

function closeIt(e) {
var node1 = Y.one('#page1');
node1.hide(true);
}

begin.on('click', toggle);
});

检查这个小提琴