zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hover-Fehler bei Listenmenü aus Submit-Buttons

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 09.12.2009, 17:04
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.12.2009
Beiträge: 5
Commander Tom befindet sich auf einem aufstrebenden Ast
Standard Hover-Fehler bei Listenmenü aus Submit-Buttons

Hallo erstmal !

Ich habe folgendes Menü gebaut, welches im IE (7 und 8 getestet) ein wenig rumzickt. Im FX und Safari passt es.

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>        
<title>Test</title>
<style type="text/css" media="screen">

DIV.hassubmenu INPUT {
  MARGIN: 0px
}

DIV.hassubmenu {
  HEIGHT: 30px;
  WIDTH: 30px;
  BACKGROUND: blue;
  FLOAT: left;
  MARGIN: 3px;
  CURSOR: pointer;
}

DIV.hassubmenu UL {
  Z-INDEX: 999;
  POSITION: absolute;
  PADDING: 0px;
  BACKGROUND-COLOR: #f3f3f4;
  LIST-STYLE-TYPE: none;
  WIDTH: auto;
  DISPLAY: none;
  TOP: 21px;
  BORDER: 1px solid black;
}

DIV.hassubmenu UL LI {
  PADDING: 4px 4px 4px 30px;
}

DIV.hassubmenu UL LI INPUT.inputlink {
  BORDER: 1px solid black;
  BACKGROUND-COLOR: gray;
  CURSOR: pointer;
}

DIV.hassubmenu:hover UL {
  DISPLAY: block
}

DIV.hassubmenu UL LI:hover {
  BACKGROUND: red
}

DIV.hassubmenu UL LI:hover INPUT.inputlink {
  BACKGROUND-COLOR: yellow
}

</style>
</head>
<body>
  <div class="menu">
    <div class="item hassubmenu">
      <img width="16px" height="16px" src="#" />
      <ul>
        <li>Listeneintrag 1.1</li>
        <li>Listeneintrag 1.2</li>
        <li>Listeneintrag 1.3</li>
        <li>Listeneintrag 1.4</li>
        <li>Listeneintrag 1.5</li>
        <li>Listeneintrag 1.6</li>
        <li>Listeneintrag 1.7</li>
      </ul>
    </div>
    <div class="item hassubmenu">
      <img width="16px" height="16px" src="#" />
      <ul>
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.1" name="" />
          <input type="hidden" value="" name="" />
        </li>
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.2" name="" />
          <input type="hidden" value="" name="" />
        </li>        
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.3" name="" />
          <input type="hidden" value="" name="" />
        </li>
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.4" name="" />
          <input type="hidden" value="" name="" />
        </li>
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.5" name="" />
          <input type="hidden" value="" name="" />
        </li>
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.6" name="" />
          <input type="hidden" value="" name="" />
        </li>
        <li>
          <input class="inputlink" type="submit" value="Listeneintrag 2.7" name="" />
          <input type="hidden" value="" name="" />
        </li>                                
      </ul>
    </div>                      
  </div>
</body>
</html>
Das Problem wird durch die Buttons verursacht, die ein Formular abschicken. Überfährt man diese zügig mit dem Mauszeiger wird die übergeordnete Liste ausgeblendet obwohl der Hover-Status noch aktiv ist. Wird die Maus nur gaaaanz langsam bewegt tritt dieser Effekt nicht auf. Ebenso wenn die Maus nicht über die Buttons fährt (deswegen der breite linke Rand).

Ich habe keine Ahnung woran das liegt und bin für jede Hilfestellung dankbar.

Natürlich würde sich ein Workaround per JS anbieten, darauf möchte ich jedoch wenn möglich verzichten.

Viele Grüße
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.12.2009, 09:09
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.12.2009
Beiträge: 5
Commander Tom befindet sich auf einem aufstrebenden Ast
Standard

Hat niemand ne Idee?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 10.12.2009, 09:40
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Moin,

gibt es keinen Link zum Problem?

Wenn du Code hier einstellst sollte der lauffähig sein.
Bei deinem Code mischt du Groß/Kleinschreibung. Unter XHTML hat man sich auf generelle Kleinschreibung geeinigt.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #4 (permalink)  
Alt 10.12.2009, 09:47
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.12.2009
Beiträge: 5
Commander Tom befindet sich auf einem aufstrebenden Ast
Standard

Die Groß- und Kleinschreibung ist ein Feature der Quelltextansicht des IE, aus welcher der relevante Code kopiert wurde...

Okay, ich schiebe das Beispiel auf meinen Webspace. Komme allerdings leider erst heute abend dazu.

So long!
Mit Zitat antworten
  #5 (permalink)  
Alt 11.12.2009, 08:58
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.12.2009
Beiträge: 5
Commander Tom befindet sich auf einem aufstrebenden Ast
Standard

Moin-moin,

hier ist der Link dazu: Test

Die Bilder habe ich für dieses Beispiel weggelassen, was aber keinen Unterschied ausmacht.
Mit Zitat antworten
  #6 (permalink)  
Alt 11.12.2009, 09:08
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.858
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Schau Dir Deinen Link mal an, im IE 7 kriegst Du die Subnavi eh nicht zu fassen (er braucht left), außerdem siehe [FAQ]FAQ[/FAQ] CSS-Prolog. Behebe das erstmal, dann kann man nach dem beschriebenen Fehler suchen.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #7 (permalink)  
Alt 14.12.2009, 17:21
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.12.2009
Beiträge: 5
Commander Tom befindet sich auf einem aufstrebenden Ast
Standard

War einige Tage Offline, darum hats ein wenig länger gedauert...

Okay, ich habe das Beispiel nochmal überarbeitet komme aber zum gleichen Ergebnis wie bisher. Hier nochmal der Link:

test

Solange man im IE nicht über die Buttons fährt, passt es. Weiß jemand Rat?
Mit Zitat antworten
Antwort

Stichwörter
buttons, hover, input, menü

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
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 12:25
Hilfe css Menu center xXcyberXx CSS 5 28.11.2010 19:51
Darstellungsproblem CSS Navigation im IE7 pcklinik CSS 7 09.09.2007 17:25
CSS Einsteiger bittet um Hilfe pcklinik CSS 0 06.09.2007 14:40
Problem mit dem Menü [erledigt] Julian CSS 2 15.01.2006 23:27


Alle Zeitangaben in WEZ +2. Es ist jetzt 19:02 Uhr.