zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Div-Verschachtelungen und onmouseover/onmouseout

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 18.11.2010, 11:00
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 29
uthomas befindet sich auf einem aufstrebenden Ast
Standard Div-Verschachtelungen und onmouseover/onmouseout

Hallo,

mein Problem ist, dass die zwei divs line1 und line2 innerhalb von div "button" den button beeinflussen. Wenn der Cursor über div line1 fährt, wird onmouseover ausgeführt und beim Herausfahren onmouseout. Das Ganze passiert auch bei div line2. Ich möchte aber, dass dies nur bei div "button" passiert.

Was kann man tun?


PHP-Code:
<li>
    <div id="button" onmouseover="mopen('menue');" onmouseout="mclose();">
        <div class="line1">
            <?php echo $this->__('headline'); ?>
        </div>
        <div class="line2">
            <?php echo $this->__('subline'); ?>
        </div>
    </div>

    <ul id="menue" onmouseout="mclosetime();" >
        <li>accessory1</li>
        <li>accessory2</li>
        <li>accessory3</li>
    </ul>
</li>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 18.11.2010, 12:45
Benutzerbild von netspy
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 13.08.2004
Ort: Leipzig
Beiträge: 1.953
netspy sorgt für eine eindrucksvolle Atmosphärenetspy sorgt für eine eindrucksvolle Atmosphäre
Standard

Was passiert denn, wenn du explizit folgendes setzt?

HTML-Code:
<div class="line1" onmouseover="return false;" onmouseout="return false;">
Gruß
__________________
AppDev Blog · AppDev Forum
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 18.11.2010, 13:16
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 29
uthomas befindet sich auf einem aufstrebenden Ast
Standard

Nichts passiert dann.

Ich hab das Beispiel separat in einem php-file getestet. Dort funktioniert es. Nur leider in der Hauptanwendung nicht. Woran könnte das liegen? Um ein konflikt mit darunterliegenden Divs zu vermeiden habe ich einen extra hohen z-index-Wert gewählt. Hmm.
Mit Zitat antworten
  #4 (permalink)  
Alt 18.11.2010, 13:52
Benutzerbild von netspy
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 13.08.2004
Ort: Leipzig
Beiträge: 1.953
netspy sorgt für eine eindrucksvolle Atmosphärenetspy sorgt für eine eindrucksvolle Atmosphäre
Standard

Was heißt „Nichts passiert dann“? Das ist doch gut, denn du willst doch, dass bei den beiden DIVs nichts passiert oder habe ich dich falsch verstanden.

Am besten du postest mal einen Link, wo man sich das Problem ansehen kann.

Gruß
__________________
AppDev Blog · AppDev Forum
Mit Zitat antworten
  #5 (permalink)  
Alt 18.11.2010, 16:30
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 29
uthomas befindet sich auf einem aufstrebenden Ast
Standard

Danke für deine Hilfe.

Das sollte passieren:
HTML-Code:
<li>
    <div id="button" onmouseover="mopen('menue');" onmouseout="mclose();">
        <div class="line1" onmouseover="return false;" onmouseout="return false;">//<--
            <?php echo $this->__('headline'); ?>
        </div>
        <div class="line2" onmouseover="return false;" onmouseout="return false;">//<--
            <?php echo $this->__('subline'); ?>
        </div>
    </div>

    <ul id="menue" onmouseout="mclosetime();" >
        <li>accessory1</li>
        <li>accessory2</li>
        <li>accessory3</li>
    </ul>
</li>

aber es passiert das:
HTML-Code:
<li>
    <div id="button" onmouseover="return false;" onmouseout="return false;">
        <div class="line1" onmouseover="mopen('menue');" onmouseout="mclose();">//<--
            <?php echo $this->__('headline'); ?>
        </div>
        <div class="line2" onmouseover="mopen('menue');" onmouseout="mclose();">//<--
            <?php echo $this->__('subline'); ?>
        </div>
    </div>

    <ul id="menue" onmouseout="mclosetime();" >
        <li>accessory1</li>
        <li>accessory2</li>
        <li>accessory3</li>
    </ul>
</li>
Mit dem Resultat, dass wenn der User über "div button" fährt, das geöffnete menue flackert, da wegen den 2 inneren div onmouseover und onmouseout ausgeführt wird.

Wie kann ich das für die inneren divs verhindern, so dass nur das äußere div (button) reagiert.
Mit Zitat antworten
  #6 (permalink)  
Alt 18.11.2010, 16:39
Benutzerbild von netspy
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 13.08.2004
Ort: Leipzig
Beiträge: 1.953
netspy sorgt für eine eindrucksvolle Atmosphärenetspy sorgt für eine eindrucksvolle Atmosphäre
Standard

Da kann ich dir leider nicht helfen. Offenbar nutzt du irgendein CMS oder Blogsystem und dieses erzeugt das HTML. Wenn du Hilfe haben möchtest, musst du schon die relevanten Informationen mitteilen und wenigstens dazu schreiben, was du nutzt und woher der Code kommt (also bspw. durch ein Plugin).

Gruß
__________________
AppDev Blog · AppDev Forum
Mit Zitat antworten
  #7 (permalink)  
Alt 18.11.2010, 16:41
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 29
uthomas befindet sich auf einem aufstrebenden Ast
Standard

Das ganze passiert innerhalb von dem Shopsystem Magento.
Bin mir aber nicht ganz sicher, ob das Problem von Magento kommt.

Die inneren Divs von button, also line1 und line2, erben onmouseover/onmouseout.
Ich hätte gerne, dass nur das Div button die event-Funktionen anstoßen kann.

Kann man diese "Vererbung" irgendwie verhindern?

Geändert von uthomas (18.11.2010 um 16:44 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 18.11.2010, 16:56
Benutzerbild von netspy
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 13.08.2004
Ort: Leipzig
Beiträge: 1.953
netspy sorgt für eine eindrucksvolle Atmosphärenetspy sorgt für eine eindrucksvolle Atmosphäre
Standard

Tut mir leid aber mit Magento kenne ich mich nicht aus. Was ich aber nicht ganz verstehe ist, wo denn dein fehlerhafter Code auftaucht. Da dort noch PHP mit dabei ist, ist das doch sicherlich ein Ausschnitt aus einem Template und das kannst du doch dann einfach bearbeiten. Warum geht das nicht?

Ich mag hier allerdings nicht weiter Hellsehen. Bitte beschreibe genauer, was wo nicht funktioniert. In HTML gibt es keine Vererbung und irgendwas oder irgendwer hat deinen Code erzeugt.

Gruß
__________________
AppDev Blog · AppDev Forum
Mit Zitat antworten
  #9 (permalink)  
Alt 18.11.2010, 17:14
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 29
uthomas befindet sich auf einem aufstrebenden Ast
Standard

Ja Magento verwendet php. Deshalb sollte es ja eigentlich auch so sein, dass onmouseover nur geführt wird, wenn der Cursor über dem Div "Button" ist.

Mit
PHP-Code:
jQuery("#button").mouseover( function ( evt )
{
    
evt evt || window.event;
    
el evt.target || evt.srcElement;
    
alert("over|"+el.getAttribute('id')+"|"+el.getAttribute('class'));
}); 
habe ich dann geprüft, von wo das Event angestoßen wird. Und tatsächlich löst das Div line1 und line2 jeweils das Event aus und nicht button. Obwohl onmouseover im Div "button" befindet.

Warum das so ist weiß ich leider nicht

Der Quellcodeausschnitt entstammt fast 1:1 aus dem Template. Viel mehr steht da nicht drin. Der Custom-phtml-Ausschnitt dann per
PHP-Code:
<?php echo $this->getChildHtml('navigation'); ?>
integriert

Geändert von uthomas (18.11.2010 um 17:18 Uhr)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 18.11.2010, 17:27
Benutzerbild von netspy
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 13.08.2004
Ort: Leipzig
Beiträge: 1.953
netspy sorgt für eine eindrucksvolle Atmosphärenetspy sorgt für eine eindrucksvolle Atmosphäre
Standard

Dann ändere doch das Template! Dafür sind Templates ja da und wenn es dort so wie von dir gepostet drin steht, musst du natürlich die entsprechenden Eventhandler aus line1 und line2 rausnehmen.

Gruß
__________________
AppDev Blog · AppDev Forum
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 20:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Header entfernen tripple CSS 17 15.06.2010 16:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 11:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 20:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 20:47 Uhr.