Hey ho,
ich bastel aktuell an einer privaten Homepage und hab meinen Lebenslauf "grafisch" über CSS formatiert.
Da bin ich schon sehr stolz drauf, da es mich viel Nerven gekostet hat.
Die Ladezeit lass ich noch von meinen Bruder (Informatiker) überprüfen und optimieren.
Aber es geht nun um das Layout und ich will dabei hover mit reinbringen. Ich wollte ähnlich wie diese CSS Hover Menüs dies machen.
.entry {
border: 1px solid black;
padding: 2px;
position: absolute;
overflow: hidden;
display: block;
float: right;
left: 90px;
z-index: 2;
}
echo "<ul class="entry" style="background-color:#".$bg.";width:".$width."px;height:".$height."px;left:".$left."px;top:".$top."px";/>";
echo "<li>";
if ($lbl_data[start] != $lbl_data[end]) {
if (empty($lbl_data[end])) {
echo "seit ".$lbl_data[start];
} else {
echo $lbl_data[start].' - '.$lbl_data[end];
}
} else {
echo $lbl_data[start];
}
echo "<br />";
echo "<b>".utf8_encode($lbl_data[kind])."</b>";
if (!empty($lbl_data[subkind])) {
echo "<br />";
echo utf8_encode($lbl_data[subkind]);
}
echo "<br /><br />";
echo utf8_encode($lbl_data[title]);
if (!empty($lbl_data[graduation])) {
echo "<br />";
echo "<u>Abschluss</u>: <b>".utf8_encode($lbl_data[graduation])."</b>";
}
echo "<br /><br />";
echo "<li><a target="_blank" href="".$lbl_data[homepage]."">".utf8_encode($lbl_data[place])."</a>";
echo "</li>";
echo "</li>";
echo "</ul>";
Alles anzeigen
Als Ausgabe kommt das entsprechend raus!
Zitat2008/09 - 2010/07
Schulische Ausbildung
Elektrotechniker - Fachrichtung: Betriebs- und Automatisierungstechnik
Abschluss: Fachhochschulreife
Städtische Fachschule für Elektrotechnik in Aschaffenburg
Wenn nun eine Aktivität nur wenige Wochen/Monate geht werden nur die ersten Zeilen angezeigt und das ist nicht praktisch.
Ich will wenn ich über diesem ganzen "entry" block bin, dass sich ein Fenster z.b. mit 500x500 pixeln öffnet wo diese Daten alle abbildet.
Ich hab zahlreiche dinge probiert und bekomm es einfach nicht hin egal was ich mache
Als Navigationsleiste hab ich folgeden code benutzt und angepasst.
#navi {
height: 42px;
background-color: #57C2F6;
border-bottom: 5px solid #0195DD;
}
#navi:after {
content:"";
display:table;
clear:both;
}
#navi ul {
padding:0;
margin:0;
list-style: none;
position: relative;
}
#navi ul li {
margin: 0 -7px 0px 0;
margin-left: 20px;
display:inline-block;
background-color:#57C2F6;
}
#navi ul li a {
line-height: 42px;
display:block;
padding:0 15px;
}
#navi ul li a:hover {
background-color: #0195DD;
z-index:1;
}
#navi ul ul {
border-top: 5px solid #0195DD;
display: none;
position: absolute;
}
#navi ul li:hover > ul {
margin-left: -20px;
display:inherit;
z-index:100;
}
#navi ul ul li {
min-width:200px;
float:none;
display:list-item;
position: relative;
}
Alles anzeigen
Das hab ich aber nicht hinbekommen darauf anzupassen.
Wäre echt schön, wenn mir jemand helfen könnte.
Liebe Grüße
Thorsten