-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathimagemap.html
46 lines (40 loc) · 1.15 KB
/
imagemap.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
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<style type='text/css'>
.tooltip { background-color:gray; opacity:0.2; }
.tooltip_display {
z-index:100;
background-color:#fcfcfc;
border: #cfcfcf solid 1px;
position:relative;
top:10px; left:0;
}
.tooltips {
}
</style>
<!--
this is just an example of how to use MapTip out of the box to add a quick hotspot to an image
you can add more than one of course, by passing the imagemap_tooltips array with more than one object.
-->
<script type='text/javascript' src='gb.maptip.jquery.js'></script>
<script type='text/javascript'>
jQuery(document).ready(function() {
imagemap_tooltips = [{
left:'125px',
top:'135px',
width:'494px',
height:'175px',
text: "A test tooltip."
}];
map = MapTip();
map.apply("#image", imagemap_tooltips);
});
</script>
</head>
<body>
<div id='image'>
<img src="#" style="width:800px; height:400px;" />
</div>
</body>
</html>