CS Dropdown Menu funktioniert nicht richtig auf Applegeräten

smisonline2

Mitglied
Hallo,

das Problem ist folgendes.


Wenn ich dort auf den "test link 0" fahre, öffnet sich das Submenu. Wnen ich jetzt auf einen Link klicke oder aus dem Menu herausfahre, geht es auf Applegeräten nicht zu oder nur manchmal. Zu 90% bleibt es aber offen, bis man auf einen andere n Link außerhalb dieses Submenus klickt. Danke für Eure Hilfe


http://www.sxrg-energy.com/pre/ttt/


Die css Definition sieht so aus.

HTML:
/* Mainnavigation */
#content_mainnavigation {
	font-size: 14px;
	/*font-weight:bold;*/
	z-index:20000;
	width:100%;
	min-width:770px;
	position:fixed;
	top:0px; 
	margin: 0 auto;
	height:115px;
  

	background-image: url(../images/header_background.png);
	background-repeat:repeat-x;
	background-position: center top; 

	}
	




#navlogo{
	top:10px;
	background-image: url(../images/headerlogo.png);
	background-repeat:no-repeat;
	background-position: center top;
	float:left;
	width:151px;
	min-width:151px;
	max-width:151px;
	height:80px;
	min-height:80px;
	max-height:80px;
	padding:0px;
	margin:0px;
	margin-top:10px;
	margin-left:20px;
	pointer-events: all;
	z-index:50000;
	/*position:fixed;*/
	}
	
	
	
	





#header {
	width:570px;
	min-width:570px;
	float:right;

	margin: 30px auto 0px auto;
	padding:0px;
	height:34px;
	
	background-color: #fff;

	filter: alpha(opacity=90);
	-khtml-opacity: 0.90;     
	-moz-opacity: 0.90;       
	opacity: 0.90;   
	}


#menu {
	padding:0px;
	float:left;
	margin-left:1px;
	}
	
#menu ul {
	list-style: none;
	margin: 0;
	padding: 0;

	}

#menu a {
	/*font-size: 1.0em;*/
	/*font-weight: bold;*/
	text-decoration: none;	
	}

#menu > ul > li > a {
	/*
	-moz-box-shadow: 	2px 2px 2px rgba(0,0,0,0.3);
	-webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.3);
	box-shadow: 		2px 2px 2px rgba(0,0,0,0.3);
	*/
	}
	
/* Top buttons */
#menu > ul > li {
	float: left;
	margin: 0px;
	position: relative;
	padding-bottom:10px;/* important  pulldown */
	}
	
#menu > ul > li > a {
	color: #cb1017;


	line-height: 32px;
	padding:10px;
	text-align:center;
	}
	

		
#menu > ul > li:hover > a {
	color: #ffffff;
	background-color: #cb1017;
	}

#menu > ul > li > a.current{
	color: #ffffff;
	background-color: #cb1017;	
	}

#menu .menu-drop > a.current {

	}

#menu .menu-drop:hover > a.current {
	}
	
#menu .menu-drop > a.current .menu-label {
	background-image: url("../images/revolverslider/drop_arrow.png");
	background-position:right -23px;
	background-repeat:no-repeat;	
	}
	
#menu .menu-drop > a {
	padding-right: 10px;
	}
		
#menu .menu-label {
	background-image: url("../images/revolverslider/drop_arrow.png");
	background-position:right 7px;
	background-repeat:no-repeat;
	-webkit-transition: background 0.1s;
	-moz-transition: background 0.1s;
	-ms-transition: background 0.1s;
	-o-transition: background 0.1s;
	transition: background 0.1s;
	padding-right: 15px;
	}

#menu .menu-drop:hover .menu-label {
	background-position:right -23px;
	-webkit-transition: background 0.1s;
	-moz-transition: background 0.1s;
	-ms-transition: background 0.1s;
	-o-transition: background 0.1s;
	transition: background 0.1s;
	}

#menu .menu-right {
	float: right;
	}
		
		
/* Dropdown */

#menu ul ul {
	min-width:220px;
	width:240px;
	padding: 0px;
	margin: 0px;
	position: absolute;
	top: 40px;
	/*left: -5000px;*/
	left:0px;
	min-width: 100%;
	z-index: 100;
	display:none;

	filter: alpha(opacity=90); /* internet explorer */
	-khtml-opacity: 0.90;      /* khtml, old safari */
	-moz-opacity: 0.90;       /* mozilla, netscape */
	opacity: 0.90;           /* fx, safari, opera */	

	-moz-box-shadow: 	2px 2px 4px rgba(0,0,0,0.3);
	-webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
	box-shadow: 		2px 2px 4px rgba(0,0,0,0.3);	
	}


#menu li:hover ul {
	/*left: 0;*/
	right:0px;
	display:block;
	border: 2px solid white;
	}

		
/* Dropdown buttons */
#menu ul ul li {
	border-bottom: 1px dotted #c7ff70;
	}

#menu ul ul a {
	background-position:left 7px;
	color: #cb1017;
	background-color: #ffffff;
	padding: 10px 10px 10px 16px;
	display: block;	
	}

#menu ul ul a:hover {
	color: #ffffff;
	background-color: #cb1017;
	}


#menu ul ul .submenudiv {
	background-position:left 7px;
	background-repeat:no-repeat;

	color: #cb1017;
	background-color: #ffffff;
	padding: 10px 10px 10px 16px;
	display: block;	
	cursor: pointer;
	}

#menu ul ul .submenudiv:hover {
	color: #ffffff;
	
	background-color: #cb1017;
	}

#socialinfo {
	float:right;
	margin: 0px;
	padding: 0px;
	margin-top: -12px;
	margin-right: 20px;
	}
 
Hallo,
ich verwende hier auch ein Applegerät (OSX 10.6.8) da funktioniert mit es einwandfrei mit chrome, Safari und Firefox.
Das einzigste was nicht stimmt ist die Auswahl des ersten Levels des Menülinks wenn ich einen Link des Submenüs aktiviere. Normalerweise müsste dann „test link 0“ auch ausgewählt bleiben.

Grüße
 
Hallo,

also ich habe hier ein "ipad mini" zum testen mit Safari.

Wenn ich also "test link 0" klicke , öffnet sich das submenu. Wenn ich jetzt auf einen Sublink klicke , bleibt das Menu auf, wenn ich aus dem menu raus fahre , bleibt es auf. Nur wenn ich auf einen anderes topmenueintrag klicke, geht das Pulldown zu.

Manchmal funktioniert es zwar, aber halt zu 90% nicht. Hast du es mehrfach neu geladen?
 
Hi,
ja habe auch mehrfach neugeladen und es kann am mobilen Safari liegen.
Da kann ich dir aber leider nicht weiterhelfen da ich kein iphone oder ipad besitze und etwsa austesten könnte.

Grüße
 
Vielleicht liegt es ja auch am JS, denn im FF Ubuntu funktioniert das Klickverhalten nicht korrekt. Wenn geklickt wird und ein Submenüpunkt angewählt wird, lässt sich test_0 nicht mehr hovern.
 
Hi,
sorry ich hab falsch getestet. Bei einem Klick bleibt es auch bei mir offen.
Aber nur mal so am Rande hier findest du die Muter aller CSS Dropdownmenüs.
Das sollte eigentlich überall funktionieren.

Grüße
 
Wen hovern das Problem wäre. Ich aheb jetzt 10 DropDowns aus dem Netz ausprobiert und die haben auf ipads minis alle das gleiche Problem. Die gehen einfach nicht zu . Wenn man die Seiten nicht dynamisch per ajax nachläd, ist es vielleicht noch so halb erträglich, da das Menu ja beim Seitenwechsel eh neu geladen wird und dann zu ist, aber wnen man Daten per Ajax einläd, ist das echt grausam:(
 

Neue Beiträge

Zurück