Hi!
How can make the menu style similar to DW accordion?
1 Answers
To make the menu style for the menu, you can log in to Dashboard / Appearances / Customize / Custom Code, and add the following code to Header Code:
<style>
.menu > li .sub-menu {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height .7s;
-moz-transition: max-height .7s;
transition: max-height .7s;
}
.menu > li .active + .sub-menu {
max-height: 1000px;
}
.menu > li .sub-menu-collapse {
position: absolute;
right: 0;
top: 3px;
cursor: pointer;
}
</style>
Then, go to Dashboard / Appearances / Customize / Custom Code, and add the following code to Footer Code section:
<script>
jQuery(document).ready(function($){
// Add arrow to submenu
$('.menu .menu-item .sub-menu').before( '<i class="sub-menu-collapse icon-caret-down"></i>');
$('.sub-menu-collapse').click(function(){
$(this).toggleClass('active');
});
});
</script>
Hope this helps !
Please login or Register to submit your answer