| Autor |
Nachricht |
the_tall1
Threadersteller
Dabei seit: 20.06.2005
Ort: Ensingen
Alter: 38
Geschlecht: 
|
Verfasst Fr 17.03.2006 12:48
Titel Positionierungsproblem |
  |
|
Hallo ich hab da mal ne Frage bezüglich der Darstellung von hover Textstücken.
Ich habe mehrere Felder die verschiedene Texte darstellen wenn man mit der Maus drüberfährt
und das tut ja auch schon sehr gut, die Frage ist wie bekomm ich das hin das alle Texte an ein
und der selben Stelle angezeigt werden.
Das ganze muss aber so gemacht werden dass auch ein cms system in das das ganze eingebaut
wird versteht was ich will.
thx,mfg
The_Tall1
|
|
| |
  |
 |
Doppelplusgut
Dabei seit: 06.10.2005
Ort: Zimmer 101
Alter: 55
Geschlecht:
|
Verfasst Fr 17.03.2006 12:55
Titel
|
|
|
Kumma da:
Klick mich!
|
|
| |
 |
|
|
Anzeige
|
|
|
the_tall1
Threadersteller
Dabei seit: 20.06.2005
Ort: Ensingen
Alter: 38
Geschlecht:
|
Verfasst Fr 17.03.2006 13:02
Titel
|
|
|
Schon klar das habe ich ja auch genau so gemacht aber die Felder mit verstecktem Text
sind bei mir in einer Pyramidenform angeordnet! Und da ich diese Felder von Hand positionieren
musste weil das mit dem inline + span+ div nicht tut, wird das Textfeld immer von der urpsrünglichen
Position aus gesetzt.
Kann man diese Boxen auch noch eleganter auf eine Linie bringen?
Zuletzt bearbeitet von the_tall1 am Fr 17.03.2006 13:05, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Doppelplusgut
Dabei seit: 06.10.2005
Ort: Zimmer 101
Alter: 55
Geschlecht:
|
Verfasst Fr 17.03.2006 13:12
Titel
|
|
|
| Zitat: | Und da ich diese Felder von Hand positionieren
musste weil das mit dem inline + span+ div nicht tut, |
Und warum nicht? WSenn ich Dich richtig verstanden habe, entspricht das Beispiel doch genau Deinen Vorstellungen, oder doch nicht?
Ohne weitere Angaben bzw ohne Code / Seite kann man nix sagen, das wäre nur rumgerate
|
|
| |
|
|
the_tall1
Threadersteller
Dabei seit: 20.06.2005
Ort: Ensingen
Alter: 38
Geschlecht:
|
Verfasst Fr 17.03.2006 13:20
Titel
|
|
|
| Code: |
h1{ color:#ee0000; font:bold; }
h2{ color:#ffffff; }
body { background-color:#9f9f9f; z-index:1; color:#ffffff; }
#box1 { position:absolute; top:100px; left:540px; width:50px; height:30px; z-index:1; }
#box2 { position:absolute; top:150px; left:390px; width:50px; height:30px; z-index:1; }
#box3 { position:absolute; top:150px; left:550px; width:50px; height:30px; z-index:1; }
#box4 { position:absolute; top:200px; left:290px; width:50px; height:30px; z-index:1;}
#box5 { position:absolute; top:200px; left:490px; width:50px; height:30px; z-index:1;}
#box6 { position:absolute; top:200px; left:710px; width:50px; height:30px; z-index:1; }
#box7 { position:absolute; top:250px; left:230px; width:50px; height:30px; z-index:1; }
#box8 { position:absolute; top:250px; left:420px; width:50px; height:30px; z-index:1; }
#box9 { position:absolute; top:250px; left:590px; width:50px; height:30px; z-index:1; }
#box10 { position:absolute; top:250px; left:780px; width:50px; height:30px; z-index:1; }
#box { width: 50px; }
ul { type:circle; }
#box a { color:#ffffff; background:#ee0000; font:bold 16px verdana, sans-serif;
text-decoration:none; display:block; padding:5px; }
#box a:hover { color:white; background:#ee0000; width:250px;}
#box a span {display:none;}
#box a:hover span { position:absolute; top:350px; left:540px;
color:white; background:#9f9f9f;
font:normal 10px courier, sans-serif; border:1% solid red;
display:block; padding:5px; z-index:2;}
|
Das ist bisher mein css dadurch das ich die positionen so angegeben habe wandert auch
der angezeigte Text entsprechend weiter. Das geht doch bestimmt besser?
thx
|
|
| |
|
|
Doppelplusgut
Dabei seit: 06.10.2005
Ort: Zimmer 101
Alter: 55
Geschlecht:
|
Verfasst Fr 17.03.2006 13:26
Titel
|
|
|
 So langsam komm ich nicht mehr mit... oder ich bin heute extrem intelligenzabstinent... aber was soll denn jetzt GENAU passieren? Wo sollen die Dinger denn erscheinen? Das sieht mir doch schon ganz gut aus....
|
|
| |
|
|
the_tall1
Threadersteller
Dabei seit: 20.06.2005
Ort: Ensingen
Alter: 38
Geschlecht:
|
Verfasst Fr 17.03.2006 13:32
Titel
|
|
|
Alsooo, hinter jeder Box steckt ein mehr oder weniger langer versteckter Text. Dieser Text
soll immer an der selben Stelle stehen. zB links die Pyramide mit den ganzen Boxen und rechts
eine Art Textfeld zur Darstellung der Texte.
Denn bisher wird der Text immer an der Stelle
Position der Box (top,left) + Position des Textes(top,left)
angezeigt und das will ich beheben. Ich hoffe mein Problem ist nun klarer?
|
|
| |
|
|
the_tall1
Threadersteller
Dabei seit: 20.06.2005
Ort: Ensingen
Alter: 38
Geschlecht:
|
Verfasst Fr 17.03.2006 16:21
Titel
|
|
|
| Code: |
h1{ color:#ee0000; font:bold; }
h2{ color:#ffffff; }
body { background-color:#9f9f9f; z-index:1; color:#ffffff; }
ul { font:bold 16px verdana, sans-serif; type:circle; }
li { font:bold 14px verdana, sans-serif; }
#box1 { position:absolute; top:100px; left:525px; width:50px; height:30px; z-index:1; }
#box2 { position:absolute; top:150px; left:430px; width:50px; height:30px; z-index:1; }
#box3 { position:absolute; top:150px; left:570px; width:50px; height:30px; z-index:1; }
#box4 { position:absolute; top:200px; left:315px; width:50px; height:30px; z-index:1; }
#box5 { position:absolute; top:200px; left:512px; width:50px; height:30px; z-index:1; }
#box6 { position:absolute; top:200px; left:710px; width:50px; height:30px; z-index:1; }
#box7 { position:absolute; top:260px; left:250px; width:50px; height:30px; z-index:1; }
#box8 { position:absolute; top:260px; left:450px; width:50px; height:30px; z-index:1; }
#box9 { position:absolute; top:260px; left:620px; width:50px; height:30px; z-index:1; }
#box10 { position:absolute; top:260px; left:800px; width:50px; height:30px; z-index:1; }
#box01 { width: 50px; }
#box02 { width: 50px; }
#box01 a { color:#ffffff; background:#ee0000;
font:bold 16px verdana, sans-serif;
text-decoration:none; display:block; padding:5px; }
#box02 a { color:#ffffff; background:#ee0000;
font:bold 16px verdana, sans-serif;
text-decoration:none; display:block; padding:5px; }
#box01 a:hover { color:white; background:#ee0000; width:50px;}
#box02 a:hover { color:white; background:#ee0000; width:50px;}
#box01 a div {display:none;}
#box02 a div {display:none;}
#box01 a:hover div { position:absolute; top:120px; left:-40px;
color:white; background:#9f9f9f;
font:normal 10px courier, sans-serif;
border:1% solid red; display:block;
padding:5px; z-index:2; width:300px; }
#box02 a:hover div { position:absolute; top:60px; left:-40px;
color:white; background:#9f9f9f;
font:normal 10px courier, sans-serif;
border:1% solid red; display:block;
padding:5px; z-index:2; width:300px; }
|
Habe es vorübergehend so gelöst das die Texte exakt unter den jeweiligen Boxen auf gleicher Höhe
dargestellt werden, aber die exakte Lösung würde mich schon noch interessieren.
|
|
| |
|
|
| |
|
|
Willkommen auf dem Portal für Mediengestalter
