Supportnet Computer
Planet of Tech

Supportnet / Forum / Webseiten/HTML

Fehler im Html-code???





Frage

Ich möchte auf einer Seite wenn ich über ein Bild mit der Maus fahre dass mehrere Bilder erscheinen! Dazu hab ich in Javascript ein Funktion: <script language="javascript"> <!-- function Navigation() { Bilder.src = "pictures/bilder.png"; Buttom.scr = "pictures/ende.png"; Forum.src = "pictures/forum.png"; Links.src = "pictures/links.png"; KListe.scr = "pictures/liste.png"; } //-> </script> und im body hab i dann: <img src="pictures/start.png" onmouseover="Navigation()" width="300" height="300" name="Buttom"> <img src="pictures/nix.png" border="0" width="160" height="150" name="Bilder"> ......... doch dies funktioniert bei einigen bildern nicht!

Antwort 1 von Supermax

Du hast an einigen Stellen statt Bildname.src ".scr" stehen.

Antwort 2 von katy

Hallo SirTobi,

so wie ich das sehe kann das überhaupt nicht funktionieren. Du definierst im JavaScript nämlich nirgendwo, was Bilder, Buttom, usw. eigentlich ist. Den Bezug zu einem img-Element im HTML mit dem Attribut name="Bilder" stellt JavaScript keineswegs automatisch her, das musst du explizit festlegen, zB mit
var Bilder=document.images["Bilder"];
Bilder.src="pictures/bilder.png";

Ein Tipp: lade zum Testen die Seite immer in den Firefox und schau dort in die JavaScript- bzw. Fehler-Konsole (Menü Extra). Da gibt es immer schon wichtige und vor allem meist verständliche Hinweise auf Fehler.

katy

Antwort 3 von kicia

Probier mal:
document.getElementsByName('Bilder')[0].src = "pictures/bilder.png";
...usw.

(Das Attribut "ID" zu verwenden wäre vermutlich geeigneter)

Antwort 4 von katy

Hallo kicia,

bei images gibt es eine eindeutige Zuordnung und kurze Syntax über name, warum willst du das unnötig komplizieren? Die Verwendung des Umwegs über getElement(s) halte ich für überflüssig, wenn du das Element auch direkt ansprechen kannst.

katy

Antwort 5 von SirTobi

warum erscheinen dann ein paar bilder und manche andere nicht!
http://tobias.obermayer.googlepages.com/home.txt

Antwort 6 von katy

Hallo Tobias,

stell doch mal die Seite zur Verfügung, dann könnte ich mal darauf schauen.

katy

Antwort 7 von SirTobi

im oberen link hab i den quellentext von der Seite!!
nur die bilder und so hob i noch nicht hochgeladn!!

Antwort 8 von katy

Hallo Tobias,

ich habe den Link gesehen. Aber um deiner Aussage darüber, dass das funktionieren soll, nachzugehen, bräuchte ich schon eine vollständige Seite (also HTML-Datei + Bilder). Den Quellcode hättest du auch hier einfach posten können.

katy

Antwort 9 von 4strings

Zitat:
warum erscheinen dann ein paar bilder und manche andere nicht!


Weil sich anscheinend die Bilddateien nicht auf dem Server stehen, bzw. ist der Pfad zu den Bildern falsch.

ich bekomme wenn ich ein Bild ansehen will folgende Meldung:

Url:
http://tobias.obermayer.googlepages.com/pictures/sippenside.png

The page you have requested could not be found. (404)

Antwort 10 von SirTobi

Antwort 11 von katy

Hallo Tobias,

die Seite lädt in meinem Opera nicht. Aber das kannst du korrigieren.
Mache aus:
</head>
<script language="javascript">
<!--
bild1 = new Image(); bild1.scr = "pictures/bilder.png";
... (dein JavaScript)
  KListe.scr = "pictures/nix.png";
	}
//->
</script>

folgendes:
<script type="text/javascript">
bild1 = new Image(); bild1.scr = "pictures/bilder.png";
... (dein JavaScript)
  KListe.scr = "pictures/nix.png";
	}
</script>
</head>

Der JavaScript-Bereich gehört in den head-Bereich, language ist veraltet und muss durch type ersetzt werden, und die Kommentarzeichen sind überflüssig. Die haben übrigens deine Seite für mich verschwinden lassen.

Und dann achte darauf überall .src zu schreiben, da gibt es immer noch Fehler!

katy

Antwort 12 von SirTobi

danke erstmal!
ich habe dies jetzt ausgebessert aber des funktiniert immer noch nicht!

Die Seite läd mein Firefox auch nicht vom Server außer ich lad die seite öfters hintereinander wieder neu!
Auf meinen PC wird die Seite angezeigt aber mit den Fehlern!

Antwort 13 von MACC

Hi........

Ich gib dir mal den HTML Code von dem, was ich unter "ONMOUSEOVER" verstehe, kann auch sein, das das null mit dem hier zu tun hat, aber kannst ja mal ausprobieren.

<a href="NAME DES LINKS"
onMouseOver="URL DEINES PICS';"onMouseOut="NAME DES PICS.src=' URL DES MOUSEOVER PICS ';">
            <img name="NAME DES PICS"src="URL DES MOUSEOVER PICS">


mfg

Antwort 14 von katy

Hallo Tobias,

bitte entferne noch diese dämlichen Kommentarzeichen, sonst kommt mein Browser nie in die Gelegenheit deine Seite anzuzeigen!

katy


Hallo MACC,

das sieht aber sehr nach Fantasiecode aus!

katy

Antwort 15 von MACC

Hey Katy .............

doch das klappt hab das selbst auf meiner ClanPage eingebaut,
sie selbst CSZC.

Du musst dann nur über die einzelnen Verzeichnisse mit deiner Maus gehen.

mfg

Antwort 16 von SirTobi

Hallo Katy

Ich hab jetzt die Kommentarzeichenentfernt

momentan erscheinen auf der Seite 3 Bilder es mussten eig. 5 neue Bilder erscheinen

Tobi

Antwort 17 von katy

Hallo Tobias,

probier es mal so:

<script type="text/javascript">
var bild1 = new Image(); bild1.scr = "pictures/bilder.png";
var bild2 = new Image(); bild2.scr = "pictures/ende.png";
var bild3 = new Image(); bild3.scr = "pictures/forum.png";
var bild4 = new Image(); bild4.scr = "pictures/links.png";
var bild5 = new Image(); bild5.scr = "pictures/liste.png";
var Bilder=document.images["Bilder"];
var Buttom=document.images["Buttom"];
var Forum=document.images["Forum"];
var Links=document.images["Links"];
var KListe=document.images["KListe"];

function Navigation() 	{
  Bilder.src = "pictures/bilder.png";
  Buttom.src = "pictures/ende.png";
  Forum.src = "pictures/forum.png";
  Links.src = "pictures/links.png";
  KListe.src = "pictures/liste.png";
}
	
function weg()  {
  Buttom.src = "pictures/start.png";
  Bilder.src = "pictures/nix.png";
  Forum.src = "pictures/nix.png";
  Links.src = "pictures/nix.png";
  KListe.src = "pictures/nix.png";
}
</script>


katy





Hallo MACC,

deine Seite funktioniert aber nicht in allen Browsern, denn es gilt immer noch das in Antwort 2 von mir gesagte. Manche Browser sind nur so "nett" im zweifelsfall zu deinen Gunsten anzunehmen, dass dud as Objekt meinst, das zufällig das ensprechende name-Attribut hat.

k.

Antwort 18 von katy

Hallo Tobias,

bei nächtlichem Grübeln fiel mir ein, das meine Version aus Antwort 17 auch Quatsch ist. Warum? Weil die Bilder, auf die da zugegriffen wird, zu dem zeitpunkt noch gar nicht im HTML vorhanden sind. Aber so gehts:

<script type="text/javascript">
var bild1, bild2, bild3, bild4, bild5, Buttom, Forum, Links, KListe;

function init() {
 bild1 = new Image(); bild1.scr = "pictures/bilder.png"; 
 bild2 = new Image(); bild2.scr = "pictures/ende.png";
 bild3 = new Image(); bild3.scr = "pictures/forum.png";
 bild4 = new Image(); bild4.scr = "pictures/links.png";
 bild5 = new Image(); bild5.scr = "pictures/liste.png";
 Bilder=document.images["Bilder"];
 Buttom=document.images["Buttom"];
 Forum=document.images["Forum"];
 Links=document.images["Links"];
 KListe=document.images["KListe"];
}

function Navigation() 	{
  Bilder.src = "pictures/bilder.png";
  Buttom.src = "pictures/ende.png";
  Forum.src = "pictures/forum.png";
  Links.src = "pictures/links.png";
  KListe.src = "pictures/liste.png";
}
	
function weg()  {
  Buttom.src = "pictures/start.png";
  Bilder.src = "pictures/nix.png";
  Forum.src = "pictures/nix.png";
  Links.src = "pictures/nix.png";
  KListe.src = "pictures/nix.png";
}
window.onload=init;
</script>


katy

Antwort 19 von SirTobi

hallo katy

danke hat funktioniert!!

window.onload=init;
was bringt dies??
sry bin halt noch anfänger im programmieren

Antwort 20 von katy

Hallo Tobias,
window.onload=init;
ist die Anweisung an den Browser: Wenn die Seite geladen ist starte die JavaScript-Funktion init()
das ist hier wichtig wie ich schon schrieb, denn bevor die Seite geladen ist kennt der Browser natürlich auch nicht die Bilder, die darin sind (Das war mein Fehler in Antwort 17). Danach kann man damit alles mögliche immer machen.

katy

Antwort 21 von SirTobi

ok danke nochmal

Antwort 22 von katy

Hallo Tobias,

noch eine Verbesserung speziell für den Internet-Explorer:
<script type="text/javascript">
var bild1, bild2, bild3, bild4, bild5, diBilder, diButtom, diForum, diLinks, diKListe;

function init() {
 bild1 = new Image(); bild1.scr = "pictures/bilder.png"; 
 bild2 = new Image(); bild2.scr = "pictures/ende.png";
 bild3 = new Image(); bild3.scr = "pictures/forum.png";
 bild4 = new Image(); bild4.scr = "pictures/links.png";
 bild5 = new Image(); bild5.scr = "pictures/liste.png";
 diBilder=document.images["Bilder"];
 diButtom=document.images["Buttom"];
 diForum=document.images["Forum"];
 diLinks=document.images["Links"];
 diKListe=document.images["KListe"];
}

function Navigation() 	{
  diBilder.src = "pictures/bilder.png";
  diButtom.src = "pictures/ende.png";
  diForum.src = "pictures/forum.png";
  diLinks.src = "pictures/links.png";
  diKListe.src = "pictures/liste.png";
}
	
function weg()  {
  Buttom.src = "pictures/start.png";
  Bilder.src = "pictures/nix.png";
  Forum.src = "pictures/nix.png";
  Links.src = "pictures/nix.png";
  KListe.src = "pictures/nix.png";
}
window.onload=init;
</script>

der IE hat nämlich ein paar Macken, die dir hier zu schaffen machen. Wenigstens die JavaScript-Macke lässt sich mit diesen Änderungen umgehen.

Was bleibt ist aber die transparente-PNG-Macke. Ich empfehle dir auf transparente GIFs umzusteigen, denn der IE6 zumindest hat große Probleme mit transparenten PNG. genau genommen sieht deine Seite in meinem IE6 deshalb besch...eiden aus. Sorry for bad news!

katy

Antwort 23 von katy

hoplla, zu schnell abgeschickt, die letzte Funktion muss natürlich auch dem IE zuliebe umgeschrieben werden:
function weg()  {
  diButtom.src = "pictures/start.png";
  diBilder.src = "pictures/nix.png";
  diForum.src = "pictures/nix.png";
  diLinks.src = "pictures/nix.png";
  diKListe.src = "pictures/nix.png";
}


Ich möchte kostenlos eine Frage an die Mitglieder stellen:


Ähnliche Themen:


Suche in allen vorhandenen Beiträgen: