https://ecudemo84804.cafe24.com/
이 사이트의 좌측 카테고리메뉴에서 누르면 부드럽게 펼쳐지는 shop 부분만
구매하고 싶어서 판매자한테 메뉴부분만 구입문의했는데 답이 없더군요.
딱 shop부분만 필요한데 이런 소스 어디 없을까요?
구글링하면 어코디언메뉴 소스는 엄청 많은데 쓸데없이 색깔이나 아이콘
덕지덕지라서 소스코드만 커지고... 위처럼 깔끔한건 없더라구요.
위와 같은 소스 아시는분 좌표좀 부탁드립니다ㅜㅜ
답변 4개 / 댓글 6개
그 정도라면 다음 처럼 간단하게 만들어 사용하시면 될것도 같습니다만
취향을 알 수 없어... ㅎㅎ 참조만 하시죠.
<style>
#shopmenu { cursor:pointer; }
#shop_sub { display:none; list-style:none; }
</style>
<div id="shopmenu">SHOP
<ul id="shop_sub">
<li>OUTER</li>
<li>TOP</li>
<li>DRESS</li>
<li>BOTTOM</li>
</ul>
</div>
<script>
$( "#shopmenu" ).click(function() {
$( "#shop_sub" ).slideToggle( "slow" );
});
</script>
답변에 대한 댓글 5개
저는 잘되길래 올려 드렷는데......어디에 문제가 있나요?
제가 많이 초보라서 신비님 링크 참고했어요.
진심 고맙습니다^^
중복이라 충돌 날 수 있습니다.
작동 모습을 보여드리기 위해 추가한 것 뿐입니다.
아르키어드https://mdbootstrap.com/docs/jquery/javascript/accordion/
주로 애용하는 MD부트스트랩입니다.
아니면 직접 짜셔도..
jquery.shop.menu.js
혹은
jquery.menu.js
에서
$gnb.mouseover(function(){ })
$gnb.mouseout(function(){ })
부분에 클릭이벤트 어코디언으로 바꾸고싶으시면 테마head.php 에서 네비게이션에 a태그를 빼주셔야하고.. $gnb대신에 해당 a태그대신 다른 태그로 교체하신거에 클릭이벤트를 걸어서 해당 안에 있는 서브네비게이션에 toggleClass 혹은 if문으로 slideUp, slideDown 걸으시면 될듯해요
답변에 대한 댓글 1개
sinbi1.
먼저, 아코디언의 영어 단어를 찾습니다.
2.
해당 영어단어와 menu 키워드로 구글링 ^^
프라푸치노Khttps://www.youtube.com/watch?v=gnyYpX2nc1g
보고 따라하세요 ㅎㅎㅎ
답변을 작성하려면 로그인이 필요합니다.
색이나 아이콘 없이 순수하게 딱 제가 원하는 스타일이에요.
근데 shop을 클릭하며 펼쳐지지는 않네요^^;;