Hi freunde,
ich bin auf der Suche nach einer Lösung zu meinem Dropdown Problem.
Meine Navigation ist mit einer Hover function versehen die ein Dropdown Menü ansteuert. nur leider funktioniert diese logischerweise nicht auf Tablets und Mobile Touch Devices.
Ich hab schon unzählige Plugins ohne Erfolg ausprobiert.
ich nutze folgendes free Theme
hier ein part der css
#topnav li {
margin-right:4.1%;
margin-left:4.1%;
padding: 0 0px 0px 0px;
float: left;
width:auto;
text-transform:uppercase;
font-size:11px;
}
#topnav a {
display: block;
padding:3px 0px 8px 0px;
text-decoration:none;
}
#topnav li a:hover{
text-decoration: none;
display: block;
}
#topnav li ul {
list-style: none;
position: absolute;
width: 130px;
top: 32px;
left:-999em;
padding:10px;
margin-left:-10px;
z-index:10;
filter: alpha(opacity=90); /* here you can set the opacity of box with text */
opacity: 0.9; /* here you can set the opacity of box with text */
/*background: url(images/bg-menu.png) repeat;*/
}
#topnav li:hover ul, #topnav li.sfhover ul { left: auto; }
#topnav li ul li:hover ul {
left: 100%;
top: -11px;
margin-left:-10px;
}
#topnav li li {
margin: 0;
padding: 0;
width: 130px;
left: auto;
height:auto !important;
position:relative!important;
}
#topnav li li a {
width: 130px;
line-height:18px;
margin: 0;
padding: 8px 0px 8px 0px!important;
}
#topnav li li a:hover { padding: 8px 0px 8px 0px; }
#topnav li:hover, #topnav li.sfhover { /* prevents IE7 drop-down topnav bug (focus on a page element prevents nested topnavs from disappearing) */
position: static;
}so wie ich aus den files entnehmen kann, ist es wohl eine jquery navigation.
ich hab von jquery aber leider nicht die größte ahnung.
Am liebsten wäre mir, eine Abfrage nach device und er soll dann alle hover fuctions in onclick events wandeln. hab nur keine ahnung wo und wie ich es implementieren soll.
Würde mich über Antworten und Ideen oder Plugins sehr freuen.
1000x Dank schon mal im Voraus