summaryrefslogtreecommitdiff
path: root/media/javascript/components/slider/examples/del.html
blob: 342e9eca9ca6553c5f5dde65130ada0560cba490 (plain)
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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head>
<title>JavaScript Bs_Slider example 2</title>

<style>
  .sliderInput {
   height:20;
    width:30;
   font-family : Arial, Helvetica, sans-serif;
   font-size : 12px;
  }
</style>

<!--
<script language="JavaScript" src="LibCrossBrowser.js"></script>
<script language="JavaScript" src="EventHandler.js"></script>
<script language="JavaScript" src="Bs_Slider.class.js"></script>
<script language="JavaScript" src="Bs_FormUtil.lib.js"></script>
-->
<script language="JavaScript" src="/_bsJavascript/lib/LibCrossBrowser.js"></script>
<script language="JavaScript" src="/_bsJavascript/lib/EventHandler.js"></script>
<script language="JavaScript" src="/_bsJavascript/components/slider/Bs_Slider.class.js"></script>
<script language="JavaScript" src="/_bsJavascript/core/form/Bs_FormUtil.lib.js"></script>

<script language="JavaScript">


<!--
function init(){
  initCrossBrowserLib();
  drawSliders();
}
/**
* @param object sliderObj
* @param int val (the value)
*/
function bsSliderChange(sliderObj, val, newPos){ 
  document.f.t.value = val;
}
// --></script>

</head>
<body bgColor="white" text="#3366aa" link="#0000ee" alink="#ff0000" 

vlink="#551a8b" onLoad="init();">

<h1>JavaScript Bs_Slider example 2</h1>

Nothing special here, very similar to example 1, just using different 

styles.

<hr>
<br>

<table>
  <tr>
    <td width="200" valign="top">
      <div id="sliderDiv3"></div>
    </td>
    <td width="200" valign="top">
    </td>
  </tr>
  <tr>
    <td colspan="2">
      <br><br><br><br>
      <form name="f">
      value: <input type="text" name="t" value="" size="6" 

style="background:yellow;">
      </form>
    </td>
  </tr>
</table>

<script>
function drawSliders() {
  mySlider3 = new Bs_Slider();
  mySlider3.objectName = 'mySlider3';
  mySlider3.attachOnChange(bsSliderChange);
  mySlider3.width         = 81;
  mySlider3.height        = 27;
  mySlider3.minVal        = 0;
  mySlider3.maxVal        = 100;
  mySlider3.valueDefault  = 50;
  mySlider3.valueInterval = 1;

  //mySlider3.imgBasePath   = 'img/';                                // IS THIS REQUIRED, IT WAS ON SAMPLE 3

  mySlider3.setBackgroundImage('volume/bg.gif', 'no-repeat');
  mySlider3.setSliderIcon('volume/slider.gif', 9, 22);

  mySlider3.useInputField = 0;
  mySlider3.draw('sliderDiv3');
}
</script>

</body></html>