tests/manual/home_key_question.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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!doctype html>
<html>
<head>
    <title>Test Page</title>
    <style type="text/css">
        .markup {
            margin: 10px 0 0 300px;
        }
    </style>
</head>
<body class="yui3-skin-sam">
<div class="markup">
    <div id="slider"></div>

    <p>
        <input type="button" id="home" value="Home">
        <input type="button" id="end" value="End">
        <!--<input type="button" id="disable" value="Disable">
        <input type="button" id="incr" value="incr">-->
    </p>
    <div id="report">0</div>
    <div id="slider2"></div>

    <p>
        <input type="button" id="home2" value="Home">
        <input type="button" id="end2" value="End">
        <!--<input type="button" id="disable" value="Disable">
        <input type="button" id="incr" value="incr">-->
    </p>
    <div id="report2">0</div>
</div>

<!--<script src="/build/yui/yui.js"></script>-->
<script src="http://yui.yahooapis.com/3.4.1/build/yui/yui-min.js"></script>
<script>
YUI({
    filter: 'raw'
}).use('slider',function (Y) {

var report = Y.one('#report'),
    report2 = Y.one('#report2');

var s = new Y.Slider({
    //axis  : 'y',
    length: '350px',
    min   : 0,
    max   : 100,
    value : 50,
//    minorStep: 3,
    after : {
        valueChange: function (e) {
            report.set('innerHTML',e.newVal);
        }
    }
});

s.render('#slider');
//////////////////////////////
var s2 = new Y.Slider({
    //axis  : 'y',
    length: '350px',
    min   : 0,
    max   : 100,
    value : 50,
//    minorStep: 3,
    after : {
        valueChange: function (e) {
            report2.set('innerHTML',e.newVal);
        }
    }
});

s2.render('#slider2');
var initVal = s2.get('value');
/////////////////////
report.set('innerHTML',s.get('value'));

Y.one('#home').on('click',function () {
    s.set('value', s.get('min'));
});
Y.one('#home2').on('click',function () {
    if(s2.get('value') === s2.get('min')){
        s2.set('value', initVal);
    }else{
        s2.set('value', s2.get('min'));
    }
});


Y.one('#end').on('click',function () {
    s.set('value', s.get('max'));
});
Y.one('#end2').on('click',function () {
    s2.set('value', s2.get('max'));
});
// Y.one('#incr').on('click',function () {
//     s.set('value', 133);
//     Y.log('myVal' + s.get('value'));
//     s.set('value', 134);
//     Y.log('myVal' + s.get('value'));
// });

});
</script>
</body>
</html>