Menu coulissant optimisé pour les smartphones. 2 styles proposés.
Le style du menu, sa position et ses interractions sont personnalisables.
Consignes d'utilisation :
- Le menu doit être situé au tout début OU à la toute fin du body et ne doit pas être dans un même élément (div...) que le reste de la page. Le reste de la page quant à lui doit se trouver dans une seule et même div avec la class 'AKL-outsideSlidingMenu', cela permettra la fermeture du menu lors d'un clic en dehors de celui-ci.
- Si vous souhaitez voir un bandeau en permanence indiquant la précense du menu, remplacer dans la class 'slidingMenu' par 'slidingMenu-border'.
Conseils d'utilisation :
- La propriété opening défini l'ouverture (optionnelle), si la valeur indiqué est 'smooth', alors l'ouverture/fermeture du menu suivra votre doigt, sinon (valeur par défaut 'rough') le menu ne suivra pas votre doigt.
- Le bouton attaché au menu (optionnel) permet son ouverture/fermeture et peux être placé tout le long du menu (btnPosition), le texte du bouton s'oriente automatiquement selon la position du menu.
- btnPosition accepte les valeurs en px et en %, mais aussi des valeurs prédéfini (top, bottom, left, right et center) pour simplifer son positionnement. Attention de prendre en compte la taille du bouton si vous utilisez une valeur précise.
- La propriété effect permet d'appliquer un effet sur le reste de la page lorsque le menu est ouvert, cette propriété correspond au 'filter' en CSS3.
- La propriété sizeOnComputer (optionnelle) permet de déterminer la taille du menu sur un ordinateur / une tablette, cette valeur peut être en px ou en %, il est recommendé d'utiliser les px (valeur par défaut : 300px).
- La propriété sizeOnSmartphone (optionnelle) est similaire à sizeOnComputer mais correspond cette fois aux smartphones, cette valeur peut être en px ou en %, il est recommendé d'utiliser les % (valeur par défaut : 50%).
- Des boutons indépendants peuvent être rajouté sur la page pour ouvrir/fermer le menu en utilisant la class 'AKL-slidingMenu-awayBtn'.
- La propriété clickToLeave (optionnelle) définit si l'utilisateur peut fermer le menu en cliquant en dehors de celui-ci (en cliquant sur l'élément ayant la class outsideSlidingMenu), le menu se fermera par défaut.