Problème hauteur de Dropdown Menu

[Michael Brunel]

Bonjour à tous,

Je galère vraiment avec mon menu et je dis pas non à une petite aide !  

J'ai attaché une photo (texte en anglais, c'était pour le support du thème, qui ne me réponds pas...).

Quand je suis dessus, le dropdown menu s'affiche mais il est décollé du menu, donc impossible d'aller dessus puisque je perds le "hover".

Je vois dans google inspecteur que j'ai un top:80px. Je n'arrive pas à trouver dans quel fichier il se trouve pour le changer (j'ai fouillé theme, custom, common, ..).

HELP ! Merci beaucoup.
 

 

Edited November 4, 2020 by Michael Brunel (see edit history)

[Eolia]

la position du dropdown est calculée en js dans ce thème. Modifiez le fichier correspondant https://preprod.robot-resto.fr/themes/ps_kitchen_tefal_2001/assets/js/jhptemplate/custom.js

	function DesktopMenu(jhp){
		if (document.body.clientWidth > mobileViewSize) 
		{
			var obj = jhp;
			var extraWidth = 0;
			var new_width_popup = 0;
			var wrapWidthPopup = $(obj).find('.jhpmain-menu-sub-menu').outerWidth(true);
			var wrapHeightPopup = $(obj).find('.jhpmain-menu-sub-menu').outerHeight(true);				
			var actualWidthPopup = $(obj).find('.jhpmain-menu-sub-menu').width();
			extraWidth = wrapWidthPopup - actualWidthPopup;
			var new_width_popup = $(obj).find('.jhpmain-menu-sub-menu .top-menu').outerWidth(true);
			var menuWidth = $('.jhpcmsmain-menu-wrapper').width();
			var subMenuLiWidth = $(obj).find('.jhpmain-menu-sub-menu > ul > li').outerWidth(true);
			var totalSubMenu = $(obj).find('.jhpmain-menu-sub-menu > ul > li').length;  
			var popupFinalWidth = (totalSubMenu * subMenuLiWidth)+40;
			var menuTopOffset = $(".jhpcmsdesktop-wrapper-navbar").offset();//menu top margin or other spacing
			var menuLiHeightOffset  = $(obj).offset();//menu inside top position like table
			var menuLiHeight  = $(obj).outerHeight(true);//line height of menu
			var menuPopopTop  = (menuLiHeightOffset.top - menuTopOffset.top) + menuLiHeight;

			var new_outer_width_popup = new_width_popup + extraWidth;
			if(popupFinalWidth > menuWidth){
				popupFinalWidth = menuWidth+40;
			}
			if(popupFinalWidth > new_outer_width_popup){
				new_outer_width_popup = popupFinalWidth;
			}
			if(wrapHeightPopup >= 400){//auto scroll when popup is bigger
				$(obj).find('.jhpmain-menu-sub-menu').addClass('jhp-auto-scroll');
			}else{
				$(obj).find('.jhpmain-menu-sub-menu').removeClass('jhp-auto-scroll');
			}
			var wraper = $('.jhpcmsmain-menu-wrapper');
			var wWraper = wraper.outerWidth();
			var posWraper = wraper.offset();
			var pos = $(obj).offset();
			var xLeft = pos.left - posWraper.left;
			if ((xLeft + new_outer_width_popup) > wWraper) xLeft = wWraper - new_outer_width_popup;
			$(obj).find('.jhpmain-menu-sub-menu').css('left', xLeft);
			$(obj).find('.jhpmain-menu-sub-menu').css('top',menuPopopTop);
			$(obj).find('.jhpmain-menu-sub-menu').css('width', popupFinalWidth);
			
			//$(obj).find('.jhpmain-menu-sub-menu').stop(true, true).slideDown(500, 'swing');//show popup
			$(obj).find('.jhpmain-menu-sub-menu').addClass('jhp-desk-open');
			
		}
	}

Cette ligne là : 

var menuPopopTop  = (menuLiHeightOffset.top - menuTopOffset.top) + menuLiHeight;

=> menuPopopTop = 80, 

=> menuLiHeightOffset = {top: 52, left: 959.90625}, 

=> menuTopOffset = {top: 42, left: 0}

en rajoutant un -10 ou -20 ca devrait le faire^^

[Michael Brunel]

Merci. Je n'ai jamais touché au JS, du coup j'ai une question de complet débutant (désolé...) : où est-ce que je dois mettre ces données ?

Quand je le mets en suivant le modèle (var...), j'obtient une erreur. J'ose pas trop faire des test de peur de tout faire bugguer.

Merci encore pour l'aide.

[Eolia]

Je ne vous ai jamais dit de recopier ces 3 lignes, surtout avec des virgules à la fin...

Ces lignes montrent les valeurs trouvées, c'est la ligne du dessus pour laquelle je vous ai proposé de rajouter -10 ou -20, soit

var menuPopopTop  = (menuLiHeightOffset.top - menuTopOffset.top) + menuLiHeight - 20;

 

[Michael Brunel]

Ok j'ai compris, je vous remercie.

J'ai fait la modification, tout fonctionne !

Bon weekend et encore MERCI