blob: eb74bed0bee5ada8fb1447c61a33f415342e7567 (
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
|
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Box Handler Quirks Mode Test</title>
<link rel="stylesheet" href="../../theme/default/style.css" type="text/css" />
<link rel="stylesheet" href="../../examples/style.css" type="text/css" />
<style type="text/css">
/* simulate quirks mode (traditional box model) in browsers other than IE */
div {
box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.olHandlerBoxZoomBox {
border: 20px solid red;
border-left-width: 10px;
border-bottom-width: 30px;
}
</style>
<script src="../../lib/OpenLayers.js"></script>
<script type="text/javascript">
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://vmap0.tiles.osgeo.org/wms/vmap0",
{layers: 'basic'} );
map.addLayer(layer);
map.zoomToMaxExtent();
}
</script>
</head>
<body onload="init()">
<h1 id="title">Box handler Quirks Mode Test</h1>
<div id="shortdesc">Test the correct appearance of the ZoomBox in quirks mode</div>
<div id="map" class="smallmap"></div>
<div id="docs">
<p>For the box to be positioned correctly, we need to know the
width of the borders.</p>
<p>Shift-click on the map. A red box should be visible around the mouse
cursor position, with 20 pixels to the top and right, 10 pixels to
the left and 30 pixels to the bottom edge of the box.</p>
<p>Drag the box both to the top-left and the bottom-right. The cursor
should always be at the top-left or bottom-right inner corner of
the box.</p>
</div>
</body>
</html>
|
