summaryrefslogtreecommitdiff
path: root/media/javascript/components/resizegrip/examples/example1.html
blob: ecb16009ee4c51595633f5162e6d0e34c334139c (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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
	<title>BlueShoes ResizeGrip Example 1</title>

<script type="text/javascript" src="/_bsJavascript/core/lang/Bs_Misc.lib.js"></script>
<script type="text/javascript" src="/_bsJavascript/components/resizegrip/Bs_ResizeGrip.class.js"></script>
<script>
function init() {
	rg = new Bs_ResizeGrip('myContainer');
	//if you use a different path, or want another icon, you can define it like this:
	//rg.gripIcon = '/_bsImages/windows/resizeWindow.gif'; 
	rg.draw();
	
	rg2 = new Bs_ResizeGrip('myContainer2');
	rg2.draw();
}
</script>
</head>

<body onload="init();" bgcolor="white">

<h1>BlueShoes ResizeGrip Example 1</h1>

This is an example of the <a href="http://www.blueshoes.org/en/javascript/resizegrip/">BlueShoes Resize Grip</a>.<br><br>

<div id="myContainer" style="position:absolute; width:200px; height:200px; border:2px outset; background-color:#D6D3CE;">
foo foo foo foo foo foo <br>
bar bar bar bar bar bar <br>
la la la la la la la la<br>
</div>

<div id="myContainer2" style="z-index:5; position:absolute; overflow:auto; top:350px; left:10px; width:200px; height:200px; border:2px outset; background-color:#D6D3CE;">
<!div id="myContainer2" style="overflow:auto; width:200px; height:200px; border:2px outset; background-color:#D6D3CE;">
foo foo foo foo foo foo <br>
bar bar bar bar bar bar <br>
la la la la la la la la<br>
foo foo foo foo foo foo <br>
bar bar bar bar bar bar <br>
la la la la la la la la<br>
foo foo foo foo foo foo <br>
bar bar bar bar bar bar <br>
la la la la la la la la<br>
foo foo foo foo foo foo <br>
bar bar bar bar bar bar <br>
la la la la la la la la<br>
foofoofoofoofoofoo <br>
bar bar bar bar bar bar <br>
la la la la la la la la<br>
</div>

</body>
</html>