地图弹窗（map pop）具体演示
<!DOCTYPE
html PUBLIC „-//W3C//DTD XHTML 1.0 Transitional//EN“
" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<Kopf>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"
/>
<title>CSS-Datei: Map Pop-Datei</title>
<style type="text/css" media="all">
* { margin:0; Polsterung:0;
}
img { border:0;
}
#show{ text-align:left;
}
ul { list-style-type:none; Hintergrund: transparent
url( ) no-repeat -130px
0px;
}
ul li a#map01:hover span.offset, ul li a#map01:focus span.offset, ul li
a#map01:active span.offset { margin-top:-1px; margin-left:230px;
}
ul li a#map02 { width:110px; Höhe:75px; margin-top:-50px;
margin-left:235px;
}
ul li a#map02:hover, ul li a#map02:focus, ul li a#map02:active {
Hintergrund: transparent
url( ) no-repeat -115px
-88px;
}
ul li a#map03:hover span.offset, ul li a#map03:focus span.offset,ul li
a#map03:active span.offset { margin-top:-89px; margin-left:245px;
}
ul li a#map04 { width:110px; Höhe: 120 Pixel; margin-top:-60px;
margin-left:5px;
}
ul li a#map04:hover, ul li a#map04:focus, ul li a#map04:active {
Hintergrund: transparent
url( ) no-repeat -240px
-153px;
}
ul li a#map05:hover span.offset, ul li a#map05:focus span.offset, ul li
a#map05:active span.offset { margin-top:-154px; margin-left:120px;
}
</style>
</head>
<body> <ul> <li><a id="map01"
href="#map01"><span class="offset"><img
src=" /><span>Dies ist der <strong>Beitrag der Popsville-Community
Büro</strong>, Ihr Zuhause für überteuerte Portogebühren. Klicken Sie auf die Karte für
mehr</span></span></a></li> <li><a
id="map02" href="#map02"><span class="offset"><img
src=" /><span>Zuhause ist, wo das Bier ist. Und das bedeutet
<strong>Dew Drop Inn</strong>. Live-Musik an den Wochenenden.
Klicken Sie auf die Karte für mehr</span></span></a></li>
<li><a id="map03" href="#map03"><span
class="offset"><img
src=" /><span>Verbringen Sie entspannte Sommernachmittage im wunderschönen
<strong>Flussstrand</strong>. Entspannen Sie sich am FKK-Strand.
Klicken Sie auf die Karte für mehr</span></span></a></li>
<li><a id="map04" href="#map04"><span
class="offset"><img
src=" /><span>Unser lokaler <strong>Wald
Traders ist ein wahres Mekka für Konsumgüter und
Hardware. Klicken Sie auf die Karte für
mehr</span></span></a></li> <li><a
id="map05" href="#map05"><span class="offset"><img
src=" /><span>Landleben bedeutet Straßentod, und das
<strong>Wild Game Diner</strong> bereitet es mit besonderen Gerichten zu
Sauce. Klicken Sie auf die Karte für
mehr</span></span></a></li> </ul>
</body>
</html>