mousover Script funktioniert teilweise nicht

[tombeat]

Hi,

Ich hab ein kleines Problem bezüglich eines kleinen Scripts. Ich hab das Script nicht selbst geschrieben, und die Benutzeroberfläche ist Joomla.

Es geht um folgende HP:


Auf der linken Seite beim Menü sieht man das sich bei mouseover ein padding von 20px einstellt und die Farbe ändert. So sollte es funktionieren.

Leider ist das nicht so auf Unterseiten bei denen eine Komponente Läuft wie zB. Forum oder Gästebuch etc.
Dort funktioniert das komischerweise nicht. Das Script ist im header immernoch vorhanden, aber es tut sich einfach nichts.

Kann mir jemand sagen wieso, und wie ich das ändern kann?

Hier das Script:

window.addEvent('domready', function() {



                 var list = $$('.art-blockcontent-body ul a');
                list.each(function(element) {

                        var fx = new Fx.Styles(element, {duration:750, wait:false, transition: Fx.Transitions.Expo.easeOut});

                        element.addEvent('mouseenter', function(){
                                fx.start({
                                        'padding-left': 20,
                                 'color': '#ffffff'
                                });
                        });

                        element.addEvent('mouseleave', function(){
                                fx.start({
                                    'padding-left': 0,
                                'color': '#4D4D4D'
                                });
                        });

                });

                 var list = $$('.art-vmenublock a');
                list.each(function(element) {

                        var fx = new Fx.Styles(element, {duration:750, wait:false, transition: Fx.Transitions.Expo.easeOut});

                        element.addEvent('mouseenter', function(){
                                fx.start({
                                        'padding-left': 20,
                                 'color': '#ffffff'
                                });
                        });

                        element.addEvent('mouseleave', function(){
                                fx.start({
                                    'padding-left': 0,
                                'color': '#4D4D4D'
                                });
                        });

                });
});

Danke schon im voraus.

LG Tom

 

[Llynyania]

AW: mousover Script funktioniert teilweise nicht

du sprichst hier Elemente an, die sich in einer Liste befinden

var list = $$('.art-blockcontent-body ul a');

so müßten die Links auf den unterseiten auch in einer liste stehen und der container in der die liste ist ebenso benannt sein. siehe struktur aus dem Quelltext deiner seite.

dieses script ist wohl explizit auf die struktur des joomla getrimmt, was schon kompliziert genug ist. jedenfalls funktioniert es nur mit dem entsprechenden gleichen DOM.

entziffern kann ichs grad noch... mehr aber nicht... leider

 

[tombeat]

AW: mousover Script funktioniert teilweise nicht

Also der Quelltext ist dort gleich. Da ändert sich nichts.

Quelltext Ausschnitt Startseite:

            <div class="art-blockcontent-body">
        <!-- block-content -->
        
        <ul class="menu">
            <li id="current" class="active item1"><a href=""><span>Startseite</span></a></li>            
            <li class="item3"><a href=""><span>Was sind Flashmobs?</span></a></li>            
            <li class="item19"><a href=""><span>Flashmobkalender</span></a></li>            
            <li class="item4"><a href=""><span>Flashmob Videos</span></a></li>            
            <li class="item17"><a href=""><span>Fotogalerie</span></a></li>            
            <li class="item12"><a href=""><span>Forum</span></a></li>
            <li class="item10"><a href=""><span>Gästebuch</span></a></li>            
            <li class="item14"><a href=""><span>Links</span></a></li>            
            <li class="item18"><a href=""><span>Impressum</span></a></li>            
        </ul>
        <!-- /block-content -->
        
                <div class="cleared"></div>
            </div>

Quelltext Ausschnitt Forum:

            <div class="art-blockcontent-body">
        <!-- block-content -->
        
        <ul class="menu">        
            <li class="item1"><a href=""><span>Startseite</span></a></li>        
            <li class="item3"><a href="/index.php?option=com_content&amp;view=article&amp;id=2&amp;Itemid=3"><span>Was sind Flashmobs?</span></a></li>        
            <li class="item19"><a href="/index.php?option=com_simplecalendar&amp;view=calendar&amp;Itemid=19"><span>Flashmobkalender</span></a></li>        
            <li class="item4"><a href="/index.php?option=com_content&amp;view=section&amp;layout=blog&amp;id=3&amp;Itemid=4"><span>Flashmob Videos</span></a></li>        
            <li class="item17"><a href="/index.php?option=com_joomgallery&amp;Itemid=17"><span>Fotogalerie</span></a></li>        
            <li id="current" class="active item12"><a href="/index.php?option=com_fireboard&amp;Itemid=12"><span>Forum</span></a></li>        
            <li class="item10"><a href="/index.php?option=com_phocaguestbook&amp;view=phocaguestbook&amp;id=1&amp;Itemid=10"><span>Gästebuch</span></a></li>        
            <li class="item14"><a href="/index.php?option=com_content&amp;view=article&amp;id=14&amp;Itemid=14"><span>Links</span></a></li>        
            <li class="item18"><a href="/index.php?option=com_content&amp;view=article&amp;id=29&amp;Itemid=18"><span>Impressum</span></a></li>
        </ul>
        <!-- /block-content -->
        
                <div class="cleared"></div>
            </div>

 

[Llynyania]

AW: mousover Script funktioniert teilweise nicht

Jetzt seh ich worum es geht... schuldigung. Ich dachte um Contenlinks.

Im Quelltext Forum ist ein zusätzliches Script sichtbar. Ups nein da steht einiges mehr drin... scheint sich was zu überschneiden.

Vergleiche mal... vielleicht wird ja was rausgeschmissen von dem Modul?! Oder durch css überschrieben?

 

[philbring]

AW: mousover Script funktioniert teilweise nicht

Hallo,

mein Firebug zeigt bei der Forum-Unterseite eine Javascript Fehlermeldung an. Hierdurch wird beim Firefox die weitere Ausführung von Javascript unterbrochen. Auf der Startseite erscheint keine Fehlermeldung.

Auf der Forum-Unterseite erhalte ich die Meldung "element.addEvent is not a function". Dieser Fehler stammt aus der Datei mouseover.js /Zeile 10).

Dieses passiert wahrscheinlich durch eine doppelte Benutzung der $-Funktion durch mootools und jquery auf der Forum-Unterseite. Auf den anderen Seiten wird jquery nicht geladen.

Joomla selbst benutzt mootools, das mod_fireboard benutzt jquery. Versuche mal jquery im "noConflict" Modus laufen zu lassen oder ändere den Namespace von jquery (beides siehe Using jQuery with Other Libraries - jQuery JavaScript Library).

Ich hoffe das dir das weiterhilft.


Viele Grüße

Peter

 

[tombeat]

AW: mousover Script funktioniert teilweise nicht

Hmmm....
OK. Da muss ich mich erst mal reindenken.

Danke für die Hilfe!!