02.09.2008, 14:43
|
|||
|
|||
HotSpot-Verweis auf CSS Box
Hallo!
Ich möchte HotSpots auf einem Bild setzen, welche dann beim überfahren mit der Maus, eine CSS Box mit näheren Informationen öffnet. Die HotSpots zu setzen ist kein Problem. Das habe ich so gelöst: Code:
<img src="xxx" width="200" height="200" border="0" alt="Karte" usemap="#usemap1">
<map name="usemap1">
<area shape="rect" coords="11,10,59,29"
href="about.blank" alt="" title="">
</map>
In diesem Fall ist der HotSpot links oben in der Ecke. Die CSS Box habe sieht so aus: Code:
<style type="text/css">
<!--
img {
border:5px;
border-color:black;
}
#box{
width:100px;
height:47px;
padding:0;
margin:20px;
font:bold 14px verdana, sans-serif;}
#box div{display:none;}
#box:hover div{
background-color:#FFFFFF;
display:block;
width:840px;
position:absolute;top:100px;left:20px;
border:1px;
border-color:#808080;
border-width:thick;
border-style:double;
padding:15px;
font:normal 14px verdana, sans-serif;}
-->
</style>
</head>
<body>
<div id="box"><a href="xxx.xx"><img src="xxx.xx" width="100" height="47" alt="Maske"></a>
<div><p>Guten Tag</p>
<p>Dies ist meine CSS Box!</p>
<p><img src="xxx.xx"></p>
</div>
</div>
</body>
</html>
MfG Marc 
|
| Sponsored Links |
|
02.09.2008, 14:58
|
||||
|
||||
Sowas wie hier: The StyleWorks { Herzlich Willkommen } beim Menü oben in der Mitte?
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ
|
| Sponsored Links |
|
02.09.2008, 15:30
|
||||
|
||||
|
HTML
Code:
<a href=""><span>Inhalt der Toolbox.</span>Linkname</a> Code:
a span {
position:relative; /* Wenn von dort auf das Element "span" positioniert werden soll. */
display: none;
}
a:hover span {
display:block;
position:absolute;
text-decoration:none; /* Müsste ein Fix für den IE gewesen sein. */
}
Bei Problemen: http://www.xs4all.nl/~ppk/css2tests/...csspopups.html
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ Geändert von Crizzo (02.09.2008 um 15:37 Uhr)
|
|
02.09.2008, 15:44
|
|||
|
|||
|
Hot CSS Box
Wenn ich mit der Maus den Verweis "Linkname" berühre, erscheint darüber der Text "Inhalt der Toolbox".
Wie erstelle ich nun den HotSpot? Und wie verknüpfe ich das jetzt aber mit dem Bild und dem Hot Spot? Ich bin verwirrt!!!! 
Geändert von tray-park (02.09.2008 um 15:47 Uhr)
|
|
02.09.2008, 16:49
|
||||
|
||||
|
Wenn es tatsächlich rechteckige Bereiche sind, dann würde ich mir Stu Nicholls | CSSplay | Image map mal anschauen, vielleicht ist das ja eine Lösung für Dich.
|
|
02.09.2008, 23:11
|
|||
|
|||
|
Zitat:
Gruss Erich
|
| Sponsored Links |
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| ie 7 - menu css - a:hover behaviour only on text not on the whole box | sycorax27 | CSS | 1 | 18.06.2007 22:34 |
| Zentrierte Box soll von Streifen durchquert werden | saltletts | CSS | 8 | 05.06.2007 16:43 |
| ps design (slices), php (dynamischer inhalt), css gestaltung | schleepy | CSS | 19 | 02.06.2006 22:46 |
| bewegliche box mit css & js | b166-er | CSS | 1 | 03.04.2006 15:30 |
| Input box - verschiebt sich bei css formatierung | ATooM | CSS | 5 | 05.04.2005 18:43 |
Genau
Linear-Darstellung
