Question

**I am developing mobile web with Custom select menu containing menu Accordion using Vertical Menu Accordion Plugin. The problem here is, in order to see the last element in the custom menu, certainly need to scroll down. But if i press the Menu Option Again its Moving to the top. Cookie is already set. I can see the Menu which i selected previously, Just that its not automatically scrolling to the previous position.

For Below Example. I have 1. Home and 2. Menu1 and 3. Menu2 and 4. Menu3

I Press Menu 3 and select Menu 3.2. It closes the menu. After i press the Menu Option Again. I need to scroll down to see the selected menu. Is there any way it will scroll automatically to the respective position?

Thank you for your time and support.**

<div id="slidemenu" class="dcjq-accordion">

            <!--
    <h3>MENU</h3> -->

    <ul class="menu" id="menu-1">
        <li class="parent"><a href="#" rel="external">HOME</a></li>
        <li class="parent"><a href="#">Menu1</a>
                         <ul id="mednu1Id">  
                            <li class="child"><a href="#>Menu1.1</a>
            </li>  
                            <li class="child"><a href="#">Menu1.2</a>
            </li>  
                            <li class="child"><a href="#>Menu1.3</a>
            </li>  
                            <li class="child"><a href="#">Menu1.4</a>
            </li> 
                         </ul>
                     </li> 
                     <li class="parent"><a href="#">Menu2</a>
                         <ul id="mednu2Id">  
                            <li class="child"><a href="#>Menu2.1</a>
            </li>  
                            <li class="child"><a href="#">Menu2.2</a>
            </li>  
                            <li class="child"><a href="#>Menu2.3</a>
            </li>  
                            <li class="child"><a href="#">Menu2.4</a>
            </li> 
                         </ul>
                     </li> 
                     <li class="parent"><a href="#">Menu3</a>
                         <ul id="mednu3Id">  
                            <li class="child"><a href="#>Menu3.1</a>
            </li>  
                            <li class="child"><a href="#">Menu3.2</a>
            </li>  
                            <li class="child"><a href="#>Menu3.3</a>
            </li>  
                            <li class="child"><a href="#">Menu3.4</a>
            </li> 
                         </ul>
                     </li> 
             </ul>
        </div>
Was it helpful?

Solution

For those who are trying to Look for answers.

This will work. Worked out well for me.

$(window).scrollTop($("ul li ul a.active").position().top)
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top