Menu CSS et JS special juste pour Mobile et Tablette
Pour l'utilisation d'un menu principal pour un site web déroulant en CSS, il ce peux que votre codage CSS qui fonctionne impécablement sur PC (Firefox, Chrome, Safarie) et non sur appareil mobile, Cellulaire, Ipad, ...
Ou même si le menu fonctionne parfaitement aussi bien sur mobile que sur PC il se peux que vous voulez avoir deux menu distinc puisse l'ergonomie et l'accessibilité sur oerdi est pas la même que sur les mobiles tel que IPhone et Android.
Pour ce faire il suffit d'avoir deux feuille de style différentes pour chacun des supports et par PHP faire la détection et afficher le CSS en conséquence.
Dans le cas d'une utilisation sur ordi du menu mais avec une toute petite résolution il est préférable d'opté pour le modèle de menu version mobile.
Appel du CSS avec détection :
%3Clink%20rel%3D%22stylesheet%22%20%20href%3D%22css%2Fmax-640px.css%3Fver%3D1%22%3E'; } else { ?>
Code HTML du menu
Code JQUERY pour afficher et cacher le menu version mobile :
$('.menu-toggle').click(function(){
$('#menu-principal').slideToggle('slow');
});
Exemple de menu version PC sur l'horizontal et déroulant et le menu version mobile avec une petite image a cliquer pour faire ouvrir le menu qui va être a la vertical et avec les sous menu indenté.