Hilfe bei javascript

[twe]

Hallo, vielleicht kann mir jemand bei Javascript helfen. Habe folgendes Script für den Hintergrund im Menü und möchte
topmenu.setColors(i, true);

haben, wenn ich beim Menülink

<a class="CurrentParent"... oder <a class="Current"...

habe.

Leider kenne ich mich mit Javascript überhaupt nicht aus

Code: PHP  [Auswählen]

           
 //find current index: k
            for (i = 0; i < a.length; i++) {
                if (url.indexOf(a[i].href.toLowerCase()) != -1 && a[i].href.length > nLength) {
                    k = i;
                    nLength = a[i].href.length;
                }
                a[i].setAttribute("i", i);
            }
            if (k == -1 && /:\/\/(?:www\.)?[^.\/]+?\.[^.\/]+\/?$/.test) {
                for (var i = 0; i < a.length; i++) {
                    if (a[i].getAttribute("maptopuredomain") == "true") {
                        k = i;
                        break;
                    }
                }
                if (k == -1 && a[0].getAttribute("maptopuredomain") != "false")
                    k = 0;
            }

            for (i = 0; i < a.length; i++) {
                if (i != k) {
                    a[i].onmouseover = function () {
                        topmenu.setColors(this.getAttribute("i"), true);
                    }
                    a[i].onmouseout = function () {
                        topmenu.setColors(this.getAttribute("i"), false);
                    };
                }
                if (i == k)
                    topmenu.setColors(i, true);
                else
                    topmenu.setColors(i, false);
           
            }

Linkback: https://www.modified-shop.org/forum/index.php?topic=21349.0

[cYbercOsmOnauT]

hmm.. so ganz kapier ich dieses Skript nicht. Wo hast Du es her?

a ist wohl ein Array in dem alle anchor tags drinstehen (var a = document.getElementsByTagname['a']). url ein String in dem irgendwelche URLs zu finden sind? Das Array der anchors wird durchlaufen und in der zweiten Zeile geschaut, ob der href im url String vorkommt. Ausserdem muss der Link länger sein als nLength vorgibt.

Code: Javascript  [Auswählen]

if (url.indexOf(a[i].href.toLowerCase()) != -1 && a[i].href.length > nLength) {

Wenn das der Fall ist, wird diesem anchor das Attribut i mit dem Counterwert vergeben und die Variable k wird auch auf den Counterwert gesetzt.

Dann wird geschaut, ob es überhaupt Treffer gab (k nicht mehr -1?). Sollte es keine Treffer gegeben haben, wird der zweite Block angegangen.

Code: Javascript  [Auswählen]

if (k == -1 && /:\/\/(?:www\.)?[^.\/]+?\.[^.\/]+\/?$/.test) {

In diesem if ist mir der zweite Teil suspekt. Die Methode test wird normalerweise anders verwendet. Normalerweise schreibt man stringvariable.test(RegExAusdruck). Der reguläre Ausdruck jedenfalls prüft auf ein String das mit / anfängt, www. möglicherweise beinhaltet (kein Muss). Sowie weitere Zeichen, die jedoch nicht mit ./ abgeschlossen werden, plus einem . und wieder weiteren Zeichen die nicht mit ./ enden.

Wieder wird das Array der anchors durchlaufen und geschaut ob es eines gibt, welches das Attribut maptopuredomain beinhaltet. Falls ja, wird k auf den Counterwert gesetzt und die Schleife unterbrochen. Sollte diese Schleife auch keine Treffer bringen und das Attribut nicht aufzufinden sein

Code: Javascript  [Auswählen]

if (k == -1 && a[0].getAttribute("maptopuredomain") != "false")

wird k auf 0 gesetzt. Die 0 hat einen späteren Sinn. Ich möchte bemerken, dass in dem oberen if die Überprüfung von k == -1 unnötig ist, das man in diesen Bereich gar nicht hinein kommt, wenn k nicht vorher schon -1 gewesen ist.

Am Ende wird das anchor Array ein letztes Mal durchlaufen. Hat der Counter nicht denselben Wert wie die Treffervariable k werden die onmouseover und onmouseout funktionen für das jeweilige anchor gesetzt. Danach folgt noch eine direkte Reaktion die wohl Farben setzt. k = 0 hat hierbei den Sinn, das, sollte es im zweiten Check keinen Treffer geben, der erste anchor Tag als Treffer angenommen wird (Index 0, Arrays fangen bei 0 an zu zähen).

Da ich dieses Skript nicht in Aktion kenne, kann ich Dir nur sagen, was die einzelnen Zeilen bedeuten und welchen wahrscheinlichen Sinn sie haben. Hoffe, es hilft Dir ein wenig.

[twe]

Danke für die Zeit die du dir genommen hast. Das Script ist ein Menü (horizontal), das ich hier eingebaut habe. Bin gerade dabei das Template umzubauen

http://www.lichtversand.com

das Script ist von hier (Multicolor Menu)

http://www.menucool.com/horizontal/javascript-menu

und ich möchte das auch bei Unterkategorien die Top-Kategorie farbig unterlegt ist

Edit: den Teil mit maptopuredomain habe ich inzwischen entfernt. Da konnte man im Menü die Startseite oder so markieren. Brauche ich aber nicht

[cYbercOsmOnauT]

Hi nochmal,

Du hast jquery bereits auf dem Server. Damit wäre Dein Skript erheblich einfacher zu lösen und zudem Crossbrowser-Kompatibel

Dein jQuery ist ausserdem ziemlich veraltet

Code: [Auswählen]

>>> $().jquery
"1.4.3"Aktuell ist die Version 1.7.2.

Ich muss mal eben einkaufen. Ich schau ob ich danach Zeit finde und Dir was kleines bastel. Irgendwie hab ich gerade Lust zu.

[twe]

mit jQuery 1.7.2 funktioniert die thickbox nicht mehr 

Edit: es gibt aber eine Lösung:
http://core.trac.wordpress.org/changeset/19456

[cYbercOsmOnauT]

Dann ist die wohl auch veraltet War ja nur ein Hinweis.

[twe]

hab ja die Lösung gefunden aber hoffentlich ist alles andere noch funktionsfähig 
wieso muss alles so umständlich sein 

[cYbercOsmOnauT]

Bei Dir herrscht auch ein heilloses Durcheinander im Header mit den Skripten. Da gäb es so manches zu optimieren.

Also magst noch eine jQuery Version des Skripts von mir haben, oder kann ich mich anderen Sachen widmen?

Ausserdem hat das Skript noch ein kleines Problem. Wenn man sich einen Artikel ansieht, ist oben die Hauptkategorie weiterhin nicht ausgemalt.

Edit: Das liegt daran, dass Dein Skript den Kategorielink aus der Adresszeile holt. Dieser ist aber beim Ansehen eines Produktes nicht mehr im Link drin. Man kann das aber umgehen, indem man den Link nicht von der Adresszeile abgreift, sondern vom Breadcrumb

[twe]

Genau das was du geschildert hast ist ja mein Problem. natürlich möchte ich eine funktionierende JQuery Version
Ich bin gerade dabei (am optimieren) . Jede Kategorie hat eine eigene .css Nur für die Farben im Menü brauche ich das Script 

[cYbercOsmOnauT]

Ich sehe gerade das man gar nicht suchen muss. Denn das betreffende anchor hat bereits class="Current" als einziger stehen. Darauf kann man den Rest sehr einfach aufbauen. Uno momento...

[cYbercOsmOnauT]

Ich hatte netterweise meinen Code nicht gespeichert und kurz vor Schluß nen Crash meines OS. Also alles nochmal. Hier mein blind geschriebener Code. Kannst es ja mal testen und möglicherweise eingeschlichene Fehler verbessern. Wie gesagt ist der Code ungetestet.

Code: Javascript  [Auswählen]

var topmenu = function () {
        // For the six color variables below, you can set one color for all menu tabs, or specify a list of colors for each menu tab.
        var fontColors = ["#FFFFFF"];
        var fontHoverColors = ["#FFFFFF"];
        var borderColors = ["#D43C00", "#74A824", "#D12E2E", "#CC8300", "#0D507A", "#CC33CC", "#8B6846", "#AA9311"];
        var borderHoverColors = ["#D43C00", "#74A824", "#D12E2E", "#CC8300", "#0D507A", "#CC33CC", "#8B6846", "#AA9311"];
        var bgColors = ["none", "none", "none", "none", "none", "none", "none", "none"];
        var bgHoverColors = ["#D43C00", "#74A824", "#D12E2E", "#CC8300", "#0D507A", "#CC33CC", "#8B6846", "#AA9311"];
        var hrefArr = [];
        return {
                initMenu: function () {
                        // Wenn ein Treffer mehrfach benötigt wird, speichert man das Objekt
                        // lieber in einer Variable, dann muss JavaScript nicht jedes Mal
                        // aufs Neue suchen
                        var m = $('#topm');
                       
                        // Existiert ein Topmenü?
                        if (!m.length)
                                return;
                       
                        // Breite des Menüs festlegen
                        m.attr('style', 'width: '+m.find('ul:first').outerWidth()+'px');
                       
                        // Splitten der Links
                        var lis = m.find('> ul > li'); // Dito für Performance
                        var others = lis.find('> a[class!="Current"][class!="CurrentParent"]');
                        var current = lis.find('> a[class^="Current"]');
                       
                        // Alle hrefs speichern für später
                        lis.find('> a').each(function(idx) {
                                hrefArr[idx] = $(this).attr('href');
                        });
                       
                        // Mouseover Funktionen
                        others.mouseover(function() {
                                topmenu.setColors($(this), true);
                        }).mouseout(function() {
                                topmenu.setColors($(this), false);
                        });
                       
                       
                        // Topmenü einfärben
                        topmenu.setColors(current, true);
                        topmenu.setColors(others, false);
                },
                setColors: function (tagobj, hover) {
                        tagobj.each(function() {
                                var curPos = $(this);
                                // Position der Farbewerte ermitteln mittels des href
                                i = $.inArray(curPos.attr('href'), hrefArr);
                               
                                // Wenn es keinen Treffer gab, zum nächsten iterieren
                                if (i === -1)
                                        return true;
                                       
                                setStyle = '';
                                if (hover) {
                                        setStyle += 'color: ' + (typeof fontHoverColors[i] != 'undefined' ? fontHoverColors[i] : fontHoverColors[0]) + ';';
                                        setStyle += ' borderTop: solid 10px ' + (typeof borderHoverColors[i] != 'undefined' ? borderHoverColors[i] : borderHoverColors[0]) + ';';
                                        setStyle += ' background: ' + (typeof bgHoverColors[i] != 'undefined' ? bgHoverColors[i] : bgHoverColors[0]) + ';';
                                }
                                else {
                                        setStyle += 'color: ' + (typeof fontColors[i] != 'undefined' ? fontColors[i] : fontColors[0]) + ';';
                                        setStyle += ' borderTop: solid 10px ' + (typeof borderHoverColors[i] != 'undefined' ? borderColors[i] : borderColors[0]) + ';';
                                        setStyle += ' background: ' + (typeof bgHoverColors[i] != 'undefined' ? bgColors[i] : bgColors[0]) + ';';
                                }
                               
                                // Farbstyle setzen
                                curPos.attr('style', setStyle);
                        }
                });
        };
} ();

// OnLoad Funktion
$(function() {
        topmenu.initMenu();
});
 

Es ist der komplette letzte JavaScript Block in Deinem Header abzüglich der Copyright Remarks die ja dann ungültig sind, weil es ein komplett neuer Code ist.

[twe]

Hallo, leider funktioniert es mit diesem Code nicht.
Hab leider, trotz deiner Anleitung, auch keine Ahnung wo ich suchen soll.
Das einzige das mir aufgefallen ist:

Code: PHP  [Auswählen]

if (i === -1)
                                        return true;

sollen da wirklich 3 X = ? Aber auch wenn ich nur 2 oder 1 verwende geht nichts.

PS: JQuery ist jetzt 1.7.2

[cYbercOsmOnauT]

== prüft auf Wertgleichheit, da ist z.B. auch 0 gleich false.

=== überprüft Wert und Form. Also es muss genau der Wert sein in der Form wie sie auf der anderen Seite auch steht. 0 === false ergibt false, jedoch 0 == false ergibt true.

Da ich es blind schrieb, dachte ich mir schon, dass es dort hier oder da einen kleinen Fehler gibt. Man müsste es life mit Firebug austesten und sehen wo es klemmt.

[twe]

Super, das Wochenende ist geretet  Wetter soll ja eh  schlecht werden 

[twe]

SyntaxError: missing ) after argument list
[Bei diesem Fehler anhalten]

});