Hi,
I have not been able to find any method to bind smart menus with scroll.
I am using version 1.1.0
Here is my code for normal functionality:
HTML:
<nav class="menu">
<ul id="main-menu" class="sm sm-vertical">
<li menu-link="section-5" class=""><a href="return false;"> About the new Cervical Screening Test </a>
<ul class="">
<li><a href="#section-5">When is the test changing and why?</a></li>
<li><a href="#section-5-1">Why am I being tested for HPV?</a></li>
<li><a href="#section-5-2">What is HPV?</a></li>
<li><a href="#section-5-3">What about non-HPV related cervical cancers?</a></li>
<li><a href="#section-5-4">What will happen during my test?</a></li>
<li><a href="#section-5-5">How does the new test work?</a></li>
<li><a href="#section-5-6">How is the new test different to a Pap smear test?</a></li>
<li><a href="#section-5-7">Why should I do the test?</a></li>
<li><a href="#section-5-8">Who should have a HPV test?</a></li>
<li><a href="#section-5-9">What if I have symptoms?</a></li>
<li><a href="#section-5-10">What will the test cost me?</a></li>
</ul>
</li>
<li menu-link="section-4" ><a href="return false;"> I’m a woman under 25 </a>
<ul class="">
<li><a href="#section-4">Why don’t I need a Cervical Screening Test?</a></li>
<li><a href="#section-4-1">What if I already had an abnormal result previously?</a></li>
<li><a href="#section-4-2">How will I know when it’s time to start getting screened?</a></li>
<li><a href="#section-4-3">I’m vaccinated. Will I still need to do the test when I turn 25?</a></li>
</ul>
</li>
<li menu-link="section-3" ><a href="return false;"> I’m a woman over 25 </a>
<ul class="">
<li><a href="#section-3-1">When do I start testing?</a></li>
<li><a href="#section-3-2">What will happen at my first Cervical Screening Test?</a></li>
<li><a href="#section-3-3">Isn’t 5 years too long to wait between tests?</a></li>
</ul>
</li>
</ul>
</nav>
Script:
$('#main-menu').smartmenus();
$('#main-menu').bind('click.smapi', function(e, item) {
var obj = $(this).data('smartmenus');
if (obj.isCollapsible()) {
lastClicked = item;
var $sub = $(item).dataSM('sub');
var $parentSub = $(item).parent().dataSM('sub');
if ($parentSub && $parentSub.dataSM('shown-before') && $parentSub.is(':visible')) { // toggle the parent li button
obj.menuHide($parentSub);
return false;
}
else if($parentSub && !$parentSub.is(':visible')){ // Close the pre-opened menu
$('#main-menu').smartmenus('menuHideAll');
obj.menuShow($parentSub);
return false;
}
else if(!$sub){ // Don't close on child menu click
return false;
}
}
});
I want to add open close the parent menus and highlight corresponding sections on scroll either direction.
.
