Плавное открытие меню?

Question

[vik7335]

Сайт novohrom.rang.su. Не знаю куда засунуть свойство transition: all 0.5s ease; что выпадающий список открывался плавно. Вернее я совал его куда только можно но не помогло. Рад любой помощи

Answer 1

[Apostol63]

У тебя у выпадающего меню стоит display: none

Тебе проще через jquery при наведении на пункт меню задать для выпадающего списка SlideToggle
Он меняет none на block автоматически и задаёт плавность

Comments

[vik7335]

А есть пример, не силен в jquery&

[Andrej Sharapov]

погуглите, вариантов полно

[vik7335]

Спасибо большое

Answer 2

[Марти Макфлай]

c display:none работать не будет. Чтобы это сделать через transition css, вам нужно, чтобы js добавлял блоку не только display:block/none, а ещё например opacity:1/0.
А проще всего в вашей js-ке show() и hide() заменить на show(500) и hide(500). Это у вас в конце файла master.js:

$('li.nav-item.dropdown').mouseenter(function(){ $(this).find('.dropdown-menu').show();   
	});
	$('li.nav-item.dropdown').mouseleave(function(){ $(this).find('.dropdown-menu').hide();   
	});
	
	
		$('.dropdown-menu-2').hide();
		

	
	$('.dropdown-item-2').mouseenter(function(){ $(this).find('.dropdown-menu-2').show();   
	});
	$('.dropdown-item-2').mouseleave(function(){ $(this).find('.dropdown-menu-2').hide();   
	});

Comments

[vik7335]

Спасибо большое

[Марти Макфлай]

vik7335, получилось?

[vik7335]

да получилось! у меня уже был написан js. Я только подставил значения). Спасибо