Firefox zeigt DIVs völlig falsch an?

Computer: Software & Programmierung JavaScript & Script-Sprachen
#1

Hi,

da mein vorheriger Thread aus einer anderen Kategorie gelöscht wurde, ich keine Ahnung hab wohin hiermit und es mir auch nicht gesagt wurde poste ich das jetzt einfach hier:

Also ich habe folgendes Problem: Ich benutze DIVs als
Navigations-Menü. Nun habe ich mit JS eine onMouseOver und
onMouseOut-Methode programmiert, die die DIVs Farbig hervorheben
soll. Im IE funktioniert alles wunderbar, jedoch sieht das Ganze im
FF nach dem onMouseOver-Event ziemlich schrecklich aus…

Hier mal eben ein Pic vom IE nach dem onMouseOver:
http://www.imagebanana.com/view/hjffud1u/IE.png

Und zum Vergleich mal FireFox:
http://www.imagebanana.com/view/oxkc13ha/FF.png

Und noch kurz meinen CSS und JS-Code:

CSS (nur Eigenschaften des DIVs):

div#element3
{
 position: relative;
 padding-left: 0px;
 padding-top: 5px;
 width: 200px;
 height: 30px;

 border: 0px solid #FF0000;
 background-image: url(../Images/navielement3.png);
 background-repeat: no-repeat;

 text-align: center;
 font-size: 18px;
 font-weight: bold;
 color: #000000;
 text-decoration: none;
}

JS:

function changeBG(name, id, status)
{
 var element = document.getElementsByTagName('div');

 for (i = 0; i 

Und der HTML/PHP-Aufruf:


    <?php $navi = array( array('Startseite','main'),<br /> array('Über uns', 'about'),
     array('Impressum', 'impressum')
     );
    
    for ($i = 0; $i {
     echo '[' .$navi[$i][0] . ' ';}?\> ](?site='%20.%20%24navi%5B%24i%5D%5B1%5D%20.%20')



Woran könnte es denn liegen, dass FF die DIVs so falsch anzeigt? Hat
da jemand vll ne Idee?


MfG KeksLord
#2

Hallo Keksi,

ich wette, dass der FF weniger „falsch“ liegt, als Dein HTML/CSS/JAVASCRIPT !!

Und das sozusagen blind, weil Deine Code-Snipples bei weitem nicht ausreichen, um sagen zu können, wo der Fehler liegt.

Es ist so … mal ist FF pingeliger … mal der IE … aber Fehler wirken sich auf jeden Fall auf einen von beiden aus :smile:)

Das ist nicht böse gemeint. Aber stell Dir vor, ich zeige Dir eine Tafel Schokolade und ein paar Schnipsel von einem Ausdruckprogramm der Einkaufbons und frage Dich … wo habe ich die Schokolade gekauft.

Ich hoffe wir können uns verständigen.
Gruß
Klaus

#3

Jo schon kapiert :stuck_out_tongue:

ich hab die ganze Sache jetzt erst mit mehreren Eigenschaften des DIVs lösen können und dazu musste ich die title-Eigenschaft benutzen, was aber sehr unglücklich ist, da jetzt jedesmal beim fokusieren des DIVs die ID der PHP-Schleife zu sehen ist :stuck_out_tongue:

Kennst du vll irgendeine anderen DIV-Eigenschaft zum bestimmen der Identität?

Hab im Moment folgende Eigenschaften in gebrauch:

ID=„element3“ -> Muss so bleiben wegen CSS
Name=„elementname“ -> Das alleine reicht FF nicht zum genauen bestimmen des gesuchten DIVs
Title="’ . $i . '" -> Eine Zahl von 0 bis unendlich (je nachdem wie groß das Navi-Menü ist…)

Nur ich hätte gerne eine unsichtbare speichermöglichkeit für die jetzige Eigenschaft Title… Gibts da vll noch eine möglichkeit?

Der neue Javascript-Ablauf:

function changeBG(title, name, status)
{
 var element = document.getElementsByTagName('div');

 for (var i = 0; i 
HTML/PHP-Aufruf:


    <?php for ($i = 0; $i < count($navi); $i++)<br />{
     echo '[' . $navi[$i][0] . ' ';}?\> ](?site='%20.%20%24navi%5B%24i%5D%5B1%5D%20.%20')



Danke schonmal für deine Hilfe :wink:

MfG KeksLord
#4

Jo schon kapiert :stuck_out_tongue:

ne … leider nicht!
Warum postest Du den PHP-Script … was gebraucht wird, ist das HTML, was dieser Script ausgibt!!
Wer weiss was in den php-variablen steht?
Ansonsten sieht der Rest ja in Ordnung aus.

Kennst du vll irgendeine anderen DIV-Eigenschaft zum bestimmen
der Identität?

Du kannst jedem DIV ein sogenanntes „custom-attribut“ geben.

hast Du ja gemacht und einfach das Attribut title hinzugefügt :smile:)

die anderen Styles kannst Du doch mit CSS über „class“ regeln.

aber warum so umständlich?

mit
onMouseOver="changeBG(this,‚1‘)
und
function changeBG(obj, status)

hast Du in der Funktion das HTML-Objekt voll im Griff und kannst alles damit machen :smile:)

if (status == …
obj.style.backgroundImage = …

dann sparst Du Dir das einlisten aller Elemente

Gruß
Klaus

#5

ID=„element3“ -> Muss so bleiben wegen CSS

und was ist mit Class?

ebenso kannst du nur mit css auch den hintergrund bei mouseOver ändern:

#element3:hover{background-image:url(bild.jpg)}

oder über class=„element3“

.element3:hover{background-image:url(bild.jpg)}

Gruß
Klaus

#6

Jo schon kapiert :stuck_out_tongue:

ne … leider nicht!
Warum postest Du den PHP-Script … was gebraucht wird, ist das
HTML, was dieser Script ausgibt!!
Wer weiss was in den php-variablen steht?
Ansonsten sieht der Rest ja in Ordnung aus.

Das PHP-Script gibt ja den HTML-Code aus und ohne den PHP-Rest sind die IDs nicht da :stuck_out_tongue:

Naja ich hab mich glaube ich etwas doof angestellt xD
Sry deswegen… Aber ich hab das ganze schon ziemlich lange nicht mehr gemacht und bin etwas außer Übung :smiley:

Aber jetzt klappt es ja :wink:

Danke für deine Hilfe :smile:

MfG KeksLord

#7

Achja noch was:

Ich habe eine Custom-Eigenschaft ausprobiert: Altbekanntes Problem beim FF, Beim IE läufts.

Dann mit dem „hover“ in CSS: FF läuft, IE streikt…

Bis jetzt läuft nur meine Methode mit der title-Eigenschaft in beiden Browsern… :confused:

Was mache ich denn da falsch? Entweder der IE oder FF streikt…

MfG KeksLord

#8

Ich habe eine Custom-Eigenschaft ausprobiert: Altbekanntes
Problem beim FF, Beim IE läufts.

läuft bei beiden … wenn es richtig ist :smile:
zum Testen:




	window.onload=function(){
	var element=document.getElementById(‚das‘)
	alert(element.getAttribute(‚das‘))
}
 Test

Dann mit dem „hover“ in CSS: FF läuft, IE streikt…
Bis jetzt läuft nur meine Methode mit der title-Eigenschaft in
beiden Browsern… :confused:
Was mache ich denn da falsch? Entweder der IE oder FF
streikt…

Dann müssen mindestens 2 Fehler vorhanden sein.
Und ohne den Quelltext kann Dir keiner darauf antworten.

#9

Das PHP-Script gibt ja den HTML-Code aus und ohne den PHP-Rest
sind die IDs nicht da :stuck_out_tongue:

Und … noch nie in den Quelltext geschaut, den PHP ausgegeben hat?
Rechte Maustaste … Quelltext anzeigen … Quelltext wird angezeigt.
Den kann man dann sogar kopieren und woanders einfügen :smile:)

Gruß
Klaus