js+jq

by qwerew0

HTML

<ul class="gnb">
	<li>
		<a href="#">회사소개</a>
		<ul class="sub">
			<li><a href="#">submenu1</a></li>
			<li><a href="#">submenu2</a></li>
			<li><a href="#">submenu3</a></li>
			<li><a href="#">submenu4</a></li>
		</ul>
	</li>
</ul>

JavaScript

var sub = document.querySelector('.sub');
sub.style.transition = 'height .5s';
sub.style.overflow = 'hidden';
sub.style.height = '0px';
document.querySelector('.gnb>li>a').addEventListener('click', function () {
    var kkk = this.nextElementSibling.style.height;
    if (kkk === '0px') {
        this.nextElementSibling.style.height = '100px';
    }
    else {
        this.nextElementSibling.style.height = '0px';
    }
});