Schrift
[thread]12964[/thread]

Opera +onMouseOver => lustiges Kaos? (Seite 3)

Leser: 3


<< |< 1 2 3 4 >| >> 40 Einträge, 4 Seiten
kristian
 2009-01-08 07:36
#117697 #117697
User since
2005-04-14
684 Artikel
BenutzerIn
[Homepage] [default_avatar]
Hallo

Mir scheint gar nicht so abwegig was deine Glaskugel da behauptet.
Da ich im Moment nicht mal mehr weiß welcher Browser da warum gemeckert hat, werde ich mir den Part in einer ruhigen Minute noch mal ansehen.
Danke für den Hinweis.

Gruß
Kristian
Struppi
 2009-01-08 11:20
#117698 #117698
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
Die CSS Eigenschaften werden in JS in der CamleCase-schreibweise benutzt
http://de.selfhtml.org/javascript/objekte/style.ht...
und es gibt zwei, drei Eigenschaften, die mit JS Schlüsselwörtern kollidieren, z.b. class oder float, diese heißen dann className bzw. cssFloat

Und alle Eigenschaften sind in JS Case sensitive, d.h. der Eventhandler heißt
Code: (dl )
onmouseover


So, jetzt guck ich mal warum die Events nicht aufgerufen werden im Opera.
Struppi
 2009-01-08 11:51
#117699 #117699
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
OK, ich hab zwei Sachen rausgefunden.

1. Der dritte Parameter der Methode addEventListener(); muss false sein, dann funktionieren die Events auch im Opera. Aber...

2. Wenn du mal die Zeile einbaust:
Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
   addEvent: function(objRef, eventType, functionToCall, captureSwitch) {
if (objRef.addEventListener) {
if(objRef.style)objRef.style.backgroundColor = '#ff0'; // <-- Diese
objRef.addEventListener(eventType, functionToCall, false);
return true;
} else if (objRef.attachEvent) {
return objRef.attachEvent("on"+eventType, functionToCall);
} else {
return false;
}
},

Dann siehst du, dass nicht alle Links erfaßt werden.

Das Problem liegt also eher an der Logik wie du die Links erfassen willst und wie Opera childNodes behandelt.

Übrigens braucht kein Opera eine extra Behandlung was die style Attribute angeht, da sind deine Browserweichen überflüssig.
Struppi
 2009-01-08 12:00
#117700 #117700
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
OK, das letzte Problem ist diese Abfrage:
Code: (dl )
1
2
3
4
5
6
	    if(BrowserDetect.browser == 'Opera'){
thisNode.setAttribute("style","text-decoration: none; border: none; ");
if(thisNode.parentNode.id == 'top_nav'){
return;
}
}

Die dazu führt, dass einige Links nicht erfaßt werden.

Zusammengefaßt würde ich die Funktion activateLinks() so schreiben:

Der Aufruf um alle Elemente zu erfassen:
Code: (dl )
KFSWScreen.activateLinks(document.getElementsByTagName('*'));


Die Funktion:
Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
    activateLinks: function (nodes) {
for(var i = 0; i < nodes.length; i++) {
var thisNode = nodes[i];
var evRes;
if(thisNode.tagName.toUpperCase() == 'A'){

if(thisNode.href == KFSWScreen.selfURL){
/* alert(thisNode) */;
thisNode.className = "current";
}
KFSWFunctions.addEvent(thisNode, "mouseover", KFSWScreen.mouseOverLinks, false);
KFSWFunctions.addEvent(thisNode, "mouseout", KFSWScreen.mouseOutLinks, false);
KFSWFunctions.addEvent(thisNode, "click", KFSWScreen.mouseClickLinks, false);
}
}
}


Dann klappt es zumindest bei mir lokal auch mit Opera.
Struppi
 2009-01-08 12:18
#117701 #117701
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
Auch die closeInfoPopup() Funktion würde ich etwas anders gestalten.

Code: (dl )
1
2
3
4
5
6
7
8
9
	closeInfoPopup: function() {
var divs = document.getElementsByTagName("div");
var reg = new RegExp('\\binfopopup\\b', 'i');
for(var i=0;i<divs.length;i++){
var this_div = divs[i];
if(reg.test(this_div.className) )
this_div.parentNode.removeChild(this_div);
}
},

Mit dem Regulären Ausdruck sorgst du dafür, dass das Element auch mehrere Klassen haben kann und parentNode spart den Zugriff auf document.body

Allerdings würde ich gar nicht die Knoten ständig ein und aushängen, sondern das popup DIV nur einmal erzeugen und mit display sichtbar und unsichtbar machen. Und dann nur den Inhalt austauschen.
kristian
 2009-01-08 12:53
#117702 #117702
User since
2005-04-14
684 Artikel
BenutzerIn
[Homepage] [default_avatar]
Hallo Struppi

Erstmal vielen Dank du machst dir ja richtig Mühe mit dem JS den ich so verbreche.
Ich arbeite deine Post mal einzeln ab.
Struppi+2009-01-08 10:20:23--
Die CSS Eigenschaften werden in JS in der CamleCase-schreibweise benutzt
http://de.selfhtml.org/javascript/objekte/style.ht...
und es gibt zwei, drei Eigenschaften, die mit JS Schlüsselwörtern kollidieren, z.b. class oder float, diese heißen dann className bzw. cssFloat

Und alle Eigenschaften sind in JS Case sensitive, d.h. der Eventhandler heißt
Code: (dl )
onmouseover


So, jetzt guck ich mal warum die Events nicht aufgerufen werden im Opera.


Case sensitive war mir klar, im Code schreibe ich ja auch so.
Wenn die Events in deinem Opera gar nicht wollen tippe ich, das du einen 8.x benutzt?
Der war mir gestern auch noch in die Hände gefallen und machte bei mir auch gar nichts, was mich aber nicht wirklich gestört hat. Wenn er nix macht macht er auch nix verkehrt ;-)
Aktuell hatte ich mir das Spiel mit 9.63 angesehen, das ist wohl der aktuelle für WinXP zumindest wurde der spontan zum Download angeboten.

Gruß
Kristian
GwenDragon
 2009-01-08 12:58
#117703 #117703
User since
2005-01-17
14848 Artikel
Admin1
[Homepage]
user image
Ahh, war länger nicht im Forum. Struppi hat schon analysiert und geholfen.

Struppi+2009-01-08 10:51:35--
1. Der dritte Parameter der Methode addEventListener(); muss false sein, dann funktionieren die Events auch im Opera.

http://dev.opera.com/articles/view/event-capture-e...

Quote
Übrigens braucht kein Opera eine extra Behandlung was die style Attribute angeht, da sind deine Browserweichen überflüssig.

Opera kann doch seit der Version 9 genügend DOM und Javascript.

Warum eine Browserweiche verstehe ich sowieso nicht. Zudem ist eine so von dir gemachte Browserweiche nur sinnvoll wenn Opera auch sich als Opera ausgibt.
Ansonsten etwas zum Lesen bezüglich der teilweisen Unsinnigkeit browser detection:
http://dev.opera.com/articles/view/using-capabilit...
http://dev.opera.com/articles/view/a-browser-sniff...

kristian+2009-01-08 06:36:04--
Da ich im Moment nicht mal mehr weiß welcher Browser da warum gemeckert hat, werde ich mir den Part in einer ruhigen Minute noch mal ansehen.

Opera besitzt auch einen Debugger namens Dragonfly (ähnlich Firebug) ;)

Das sind halt die alltäglichen Qualen des Cross Browser-Programmentwicklers.
kristian
 2009-01-08 13:03
#117704 #117704
User since
2005-04-14
684 Artikel
BenutzerIn
[Homepage] [default_avatar]
Hallo
Struppi+2009-01-08 11:00:55--
OK, das letzte Problem ist diese Abfrage:
Code: (dl )
1
2
3
4
5
6
	    if(BrowserDetect.browser == 'Opera'){
thisNode.setAttribute("style","text-decoration: none; border: none; ");
if(thisNode.parentNode.id == 'top_nav'){
return;
}
}

Die dazu führt, dass einige Links nicht erfaßt werden.


Das war absolut so gewollt.
Diese Zeile:
Code: (dl )
thisNode.setAttribute("style","text-decoration: none; border: none; ");

entfernt den border unter den Links die, von unten mit der Maus berührt, nicht funktionierten. Hier ist für den 9.63 definitiv der border das Problem, wenn der weg ist funktioniert es ja einwandfrei.

Der Teil:
Code: (dl )
1
2
3
if(thisNode.parentNode.id == 'top_nav'){
return;
}

bewirkt das Opera bei den oberen Links im Moment deaktiviert ist und sollte so bleiben, bis ich da ein Lösung habe, ich gehe davon aus, dass auch da eine CSS-Formatierung der Grund für die Seltsamkeiten ist, hatte aber bislang keine Zeit das zu testen.

Struppi+2009-01-08 11:00:55--
Zusammengefaßt würde ich die Funktion activateLinks() so schreiben:

Der Aufruf um alle Elemente zu erfassen:
Code: (dl )
KFSWScreen.activateLinks(document.getElementsByTagName('*'));


Die Funktion:
Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
    activateLinks: function (nodes) {
for(var i = 0; i < nodes.length; i++) {
var thisNode = nodes[i];
var evRes;
if(thisNode.tagName.toUpperCase() == 'A'){

if(thisNode.href == KFSWScreen.selfURL){
/* alert(thisNode) */;
thisNode.className = "current";
}
KFSWFunctions.addEvent(thisNode, "mouseover", KFSWScreen.mouseOverLinks, false);
KFSWFunctions.addEvent(thisNode, "mouseout", KFSWScreen.mouseOutLinks, false);
KFSWFunctions.addEvent(thisNode, "click", KFSWScreen.mouseClickLinks, false);
}
}
}


Dann klappt es zumindest bei mir lokal auch mit Opera.


Das werde ich testen, ich glaube schon fest, das ist dann der Knackpunkt für den 8.x er.

Danke & Gruß
Kristian
Struppi
 2009-01-08 13:07
#117705 #117705
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
kristian+2009-01-08 11:53:50--
Wenn die Events in deinem Opera gar nicht wollen tippe ich, das du einen 8.x benutzt?
Nein, ich habe hier 9.23

Das mit dem dritten Parameter, klappt bei mir nur mit false geklappt, warum auf der Opera Seite dieser immer true ist weiß ich nicht. Man kann das bei Kristians Skript schön ausprobieren:
Code: (dl )
		 objRef.addEventListener(eventType, functionToCall, true);

Kein eventaufruf
Code: (dl )
		 objRef.addEventListener(eventType, functionToCall, false);

Event wird aufgerufen.
Struppi
 2009-01-08 13:12
#117706 #117706
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
Ich hab hier mal einen Testcase, der bei mir im Opera soweit funktioniert (die Bilder der Vorschau werden nur nicht geladen, da diese von einem Skript kommen)

[EDIT] Dort ist auch die komplette Browserweiche draussen.
<< |< 1 2 3 4 >| >> 40 Einträge, 4 Seiten



View all threads created 2009-01-07 21:00.