Dynamische grafische Buttons
Flo
- design/layout
Moin habe folgendes Problem!
Und zwar habe ich eine indexseite wo ich Dynamische grafische Buttons gemacht habe was auch soweit funzt. Und nun wollte ich noch auf den anderen Seiten die ich habe noch zurück Buttons machen aber dieses klappt nicht! Habe auch schon ausprobiert die Seite Index zu nennen aber die zweite Grafik wird trotzdem nicht angezeigt!
Der Quelltext lautet:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<link rel="SHORTCUT ICON" href="http://www.flo91.de/images/flo.ico">
<head>
<title>
Florians Homepage
</title>
<link rel="stylesheet" type="text/css" href="http://flo91.de/steckbrief.css">
<style type="text/css">
<!-- -->
</style>
<script type="text/javascript">
Normal7 = new Image();
Normal7.src = "http://flo91.de/Button/button7.bmp";
Highlight7 = new Image();
Highlight7.src = "http://flo91.de/Button/button7h.bmp";
function Bildwechsel (Bildnr, Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
</script>
</head>
<body oncontextmenu="return false">
<div id="bg">
<div id="body">
<table border="0" align="center">
<tr>
<td>
<h1>Steckbrief</h1></td>
</tr>
<tr>
<th align="left">
Name:
<br>
<br>
</th>
<th align="left">
Florian
<br>
<br>
</th>
<td align="left" rowspan="5000">
<img src="http://flo91.de/images/Badmintonmanschaft.JPG" alt="Badmintonmanschaft.JPG, 9 kB" title="Meine Badminton Mannschaft" border="0" height="240" width="320">
<br>
<br>
<img src="http://flo91.de/images/FlorianundEike.jpg" alt="FlorianundEike.jpg, 14 kB" title="Eike und ich auf Klassenfahrt in Prag" border="0" height="240" width="320"></td>
</tr>
<tr>
<th align="left">
Jahrgang:
<br>
<br>
</th>
<th align="left">
1991
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Größe:
<br>
<br>
</th>
<th align="left">
1,86 (ist tagesabhänig)
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Haarfarbe:
<br>
<br>
</th>
<th align="left">
blond
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Augenfarbe:
<br>
<br>
</th>
<th align="left">
blau
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Lieblingsfarbe:
<br>
<br>
</th>
<th align="left">
blau
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Lieblingsmusik:
<br>
<br>
</th>
<th align="left">
Hip Hop
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Badminton-Bespannung:
<br>
<br>
</th>
<th align="left">
Ashaway Power Gut 65
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Lieblings Prozessor:
<br>
<br>
</th>
<th align="left">
AMD Athlon(tm) 64 X2
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Was ich nicht ab kann ist:
<br>
<br>
</th>
<th align="left">
wenn ich wieder Elendiger Zweiter geworden bin!
<br>
<br>
</th>
</tr>
<tr>
<th align="left">
Was mich sonst noch nervt:
<br>
</th>
<th align="left">
das erzähle ich euch nicht :-)
<br>
</th>
</tr>
</table>
<br>
<p align="center">
<a href="http://flo91.de/nc6/1152x864/index.html" onmouseover="Bildwechsel(6, Highlight7)" onmouseout="Bildwechsel(6, Normal7)">
<img src="http://flo91.de/Button/button7.bmp" width="143" height="38" border="0" alt=""></a>
</p>
</div>
</div>
</body>
</html>
Hello,
window.document.images[Bildnr].src = Bildobjekt.src;
Diese Zeile verursacht bei mir erstmal einen JavaScript-Error
Das Objekt ist zum Zeitpunkt der Benutztung noch nicht bekannt.
Harzliche Grüße vom Berg
http://bergpost.annerschbarrich.de
Tom
Und zwar habe ich eine indexseite wo ich Dynamische grafische Buttons gemacht habe was auch soweit funzt. Und nun wollte ich noch auf den anderen Seiten die ich habe noch zurück Buttons machen aber dieses klappt nicht! Habe auch schon ausprobiert die Seite Index zu nennen aber die zweite Grafik wird trotzdem nicht angezeigt!
Zähle bitte mal die Anzahl der Grafiken im Dokument. Jetzt frage ich Dich, wo das 7. Bild mit der Indexnummer 6 ist.
Zum Quelltext:
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
Du solltest besser einen Zeichensatz verwenden, der auch auf Systemen verfügbar ist, die kein Windows-Betriebssystem verwenden. In Deinem Fall bietet sich ISO 8859-1 an.
<head>
[...]
</head>
Das HEAD-Element innerhalb eines HEAD-Elementes ist nicht erlaubt.
<body oncontextmenu="return false">
Das BODY-Element hat kein Attribut 'oncontextmenu'. Unabhängig davon ist es Unsinn, das Kontextmenü abschalten zu wollen, auch für IE-User.
<div id="bg">
<div id="body">
Warum verschachtelst Du hier so viele DIVs?
<table border="0" align="center">
<tr>
<td>
<h1>Steckbrief</h1></td>
</tr>
Hier braucht man keine Tabellenzelle.
<tr>
<th align="left">
Name:
<br>
<br>
</th>
<th align="left">
Florian
<br>
<br>
</th>
<td align="left" rowspan="5000">
<img src="http://flo91.de/images/Badmintonmanschaft.JPG" alt="Badmintonmanschaft.JPG, 9 kB" title="Meine Badminton Mannschaft" border="0" height="240" width="320">
<br>
<br>
<img src="http://flo91.de/images/FlorianundEike.jpg" alt="FlorianundEike.jpg, 14 kB" title="Eike und ich auf Klassenfahrt in Prag" border="0" height="240" width="320"></td>
</tr>
<tr>
Um Gottes Willen, was tust Du da! Das Aussehen einer Webseite gestaltet man mit konsequentem CSS-Einsatz, missbrauche niemals BR-Elemente, um Abstände zu erzeugen. Warum verwendest Du soviele TH-Elemente? Warum dehnst Du die letzte Zelle über nicht vorhandene 5000 Zeilen?
Bitte validiere Dein HTML, es sind so viele Fehler drin, dass es schon ein kleines Wunder ist, dass die Browser die Seite nicht vermurksen.
<p align="center">
<a href="http://flo91.de/nc6/1152x864/index.html" onmouseover="Bildwechsel(6, Highlight7)" onmouseout="Bildwechsel(6, Normal7)">
<img src="http://flo91.de/Button/button7.bmp" width="143" height="38" border="0" alt=""></a>
</p>
Schau Dir mal den Bildwechsel mit CSS an, ganz ohne Javascript.
Einen kleinen Schubser für den Aufbau:
<div id="bilder">
<img src="..." alt="..."><br>
<img src="..." alt="...">
</div>
<table id="inhalt">
<!-- Tabelleninhalt -->
</table>
Dein bereinigtes CSS:
body {
font-family:arial,sans-serif;
font-variant:normal;
font-weight:bold;
font-style:normal;
font-size:100.01%;
color:white;
background-color:black;
text-align:left;
margin:0;
background-image:url(images/florian.png);
background-repeat:no-repeat;
background-position:center center;
background-attachment:fixed;
}
img {
margin:1em;
}
#bilder {
float:right;
}
Die Bilder könntest Du noch in eine Liste packen, darauf habe ich jetzt erstmal verzichtet und stattdessen ein DIV genommen.
Siechfred
Hello out there!
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
Du solltest besser einen Zeichensatz verwenden,
Du meinst Zeichen_codierung_.
der auch auf Systemen verfügbar ist, die kein Windows-Betriebssystem verwenden.
Ich habe allerdings auch noch keinen Browser gesehen, der mit den Windows-Codepages nicht klarkäme. Selbst Konqueror unter UNIX/Linux tut dies.
In Deinem Fall bietet sich ISO 8859-1 an.
In jedem Fall bietet sich UTF-8 an.
See ya up the road,
Gunnar
Du solltest besser einen Zeichensatz verwenden,
Du meinst Zeichen_codierung_.
Jaja ;)
der auch auf Systemen verfügbar ist, die kein Windows-Betriebssystem verwenden.
Ich habe allerdings auch noch keinen Browser gesehen, der mit den Windows-Codepages nicht klarkäme. Selbst Konqueror unter UNIX/Linux tut dies.
Wenn Du das sagst, ich jedenfalls wäre vorsichtig. Genauso wie es da draußen User mit deaktiviertem Javascript und ohne Flash-Plugin gibt, wird es bestimmt auch User geben, deren System ein Problem mit win-1250 hat. War da nicht mal was mit Usability ;)
In Deinem Fall bietet sich ISO 8859-1 an.
In jedem Fall bietet sich UTF-8 an.
Mag ja sein, aber im vorliegenden Fall genügt der ISO-Zeichenvorrat.
Siechfred