wucher wichtel: Mouseover bei klapptext

Beitrag lesen

SELF-Forum

Mouseover bei klapptext

wucher wichtel
– Informationen zu den Bewertungsregeln

Hallo!

Wenn du mir wirklich dabei helfen würdest, was super nett wäre,

Dafür ist das Forum ja da :-)

überlasse ich dir natürlich die Entscheidung.

Ok, dann wähle ich Möglichkeit 1. Sie ist zwar für uns beide anstrengender, aber es lohnt sich.

  
<div id="all" align="center">

Alle HTML-Angaben, die das Aussehen steuern (in diesem Fall das Attribut align) sollten durch CSS ersetzt werden -> text-align.

  
<div id="header">  
</div>

Kommt da eventuell noch was rein? Sonst kannst du das rausschmeißen.

  
<table width="100" border="0" cellpadding="0" cellspacing="0">  
       <tr>  
         <td><a href="index.php?show=start" onMouseOver="change(0,mouseover0)" onMouseOut="change(0,standart0)"><img src="images/start.jpg" border="0" /></a></td>  
         <td>  
           <!--  
            [...]  
           -->  
         </td>  
       </tr>  
     </table>

Tabellen sollten nur für tabellarische Daten eingesetzt werden. Zum Beispiel für einen Fahrplan o.ä. Ein Menü ist eher eine *Liste* von Links. Deswegen wäre es besser, wenn du <ol> oder <ul> nimmst, und diese dann per CSS formatierst.

  
<font size="-2"><b><font color="#2C2D22"><div align="center">Galerie.</div></font></b> <br />

Der folgende Code hätte das gleiche Ergebnis:

  
<h1>Galerie</h1>

Ich habe hier eine <h1> gewählt, weil es die Überschrift der Seite ist. Die Schriftgröße, Schriftfarbe, und das Schriftgewicht kannst du mit CSS einstellen -> font.

  
<script type="text/javascript">  
<!--  
//viel JS-Code  
//-->  
</script>

Kleiner Tip: Die HTML-Kommentare sind unnötig. Das hat man früher gebraucht, dass Browser, die kein JS können, dieses ignorieren und nicht als Text ausgeben. Das dürfte heute wohl nicht mehr der Fall sein.
Viel wichtiger ist, dass du zweimal die Funktion change() und viermal die Funktion Klappen() in deinem HTML-Dokument hast. Das ist unnötig. Einmal reicht jeweils vollkommen aus.

  
function Klappen(Id) {  
var KlappText = document.getElementById('Lay'+Id);  
var KlappBild = document.getElementById('Pic'+Id);  
var jetec_Minus="images/minus.jpg", jetec_Plus="images/plus.jpg";  
if (KlappText.style.display == 'none') {  
KlappText.style.display = 'block';  
KlappBild.src = jetec_Minus;  
} else {  
KlappText.style.display = 'none';  
KlappBild.src = jetec_Plus;  
}}

Du formatierst deinen Code nicht, bzw. nicht durchgängig. Diesen JS-Block kann man nur schwer lesen.

  
function Klappen(Id) {  
  var KlappText = document.getElementById('Lay'+Id);  
  var KlappBild = document.getElementById('Pic'+Id);  
  var jetec_Minus="images/minus.jpg", jetec_Plus="images/plus.jpg";  
  
  if (KlappText.style.display == 'none') {  
    KlappText.style.display = 'block';  
    KlappBild.src = jetec_Minus;  
  } else {  
    KlappText.style.display = 'none';  
    KlappBild.src = jetec_Plus;  
  }  
}

So ist das ganze viel übersichtlicher. Wenn du deinen kompletten Code so formatieren würdest, dann wäre es auch einfach dir zu helfen.

  
<a href="javascript:Klappen(1)">

Das javascript: kannst du weglassen. Mache es lieber über onclick.

  
<br /><br />

Mehr als ein <br> deutet darauf hin, dass du einen Abstand regeln willst. Aber das geht viel viel besser und genauer mit CSS -> margin & padding.

  
 <style>  
a:link {text-decoration:underline;color:#6F7F0A}  
a:visited {text-decoration:underline;color:#6F7F0A}  
a:active {text-decoration:underline;color:#6F7F0A}  
a:hover {text-decoration:underline;color:#2C2D22}  
</style>

<style>-Bereiche lagerst du am besten in ein externes CSS aus, oder du schreibst es wenigstens in den <head>-Bereich.

So :-) Das war's für den Anfang. Wenn du Fragen hast, dann poste einfach.

ciao, ww

--
Spiderpig, Spiderpig,
Does what ever a spiderpig does.
Can he swing, from a web?
No he cant, he's a pig.
Look out, he is a spiderpig
Beitrag melden
–
Informationen zu den Bewertungsregeln