Tutorials
Einige nützliche Hilfen und Code-Schnipsel, die ich immer wieder benötige und deshalb hier für alle sammle.
jquery.mobileSelect - Plugin um Select-Navigationen automatisch aus Navigationen zu erstellen
Da ich in letzter Zeit öfter mal große Menüs für mobile Webseiten zugänglich machen musste, die so viele Unter- und Unter-Unter-Seiten haben, habe ich mich dazu entschieden ein normales HTML-Select zu erstellen, da dieses auf jedem Gerät funktioniert und bedienbar ist. Dafür habe ich bei Wordpress und TYPO3 immer ein 2. Menü rendern lassen und mir dann gedacht, dass man dies auch mit Javascript lösen könnte. Deswegen habe ich ein jQuery-Plugin geschrieben, das genau das bewerkstelligt.
Im Folgenden ist die Funktionsweise mit allen Optionen einmal aufgelistet und darunter dann die Demo, die daraus resultiert.
$('.menu').mobileMenu({
className: "mobileMenu",
selectId: "mobileMenu",
depthSign: '-',
target: $('.testwrapper'),
minDepth: 0,
maxDepth: 10000
});
Demo
<script src="/wp-content/themes/andreknieriemv3/resources/js/jquery.mobileSelect.js"></script>
<script>
jQuery(function(){
jQuery('.menu').mobileMenu({
className: "mobileMenu",
selectId: "mobileMenu",
depthSign: '-',
target: jQuery('.testwrapper'),
minDepth: 0,
maxDepth: 10000
});
});
</script>
Html-Menü
Erstelltes Select-Menü
Für weitere Informationen könnt ihr auf mein Github Repository gucken und euch das Plugin herunterladen.
Kommentare
Es gibt noch keine Kommentare. Sei der Erste!
Hinterlasse einen Kommentar