Horizontal Scrollbar also triggers the sidebar collapse behaviour

[Tuan Nam Dinh Tran]

Hi SyncFusion team,

I was playing around with the sidebar control example, and I added these two things into the right hand side

display:flex

overflow:auto

The reason for doing that is to force the browser to display a horizontal scroll for the right hand side. You can refer to the picture below for more details.

I notice that if I move the scrollbar to the right and then "throw" it back to the left, the sidebar would also collapse without clicking the hamburger on the top left. Just wondering if there is a way to stop this behaviour, so the collapsing is only triggered if I click on the hamburger?

[Shalini Maragathavel]

Hi Tuan, 

Greetings from Syncfusion support. 

We checked your query and suspect that you have performed scrolling using touch(since we are not facing the reported issue while using mouse for scrolling). We would like to let you know that, by default enableGesture is set as true, the Sidebar will be closed while touch actions are performed. You can prevent the Sidebar from closing while performing touch actions by setting enableGesture as false as demonstrated in the below code snippet. 

_layout.cshtml 

<ejs-sidebar target=".main-content" enableGestures="false" enableDock="true" dockSize="44px" close="onClose"> 

        <e-content-template> 

            <div class="main-menu"> 

                <div>
                 . . . 

                </div> 

            </div> 

        </e-content-template> 

    </ejs-sidebar> 

 

Please find the below sample for your reference. 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication-111485360.zip

API: https://ej2.syncfusion.com/javascript/documentation/api/sidebar/#enablegestures

Please get back to us if you need further assistance.

Regards, 

Shalini M. 

[Tuan Nam Dinh Tran]

Thanks a lot syncfusion team! 

[Keerthana Rajendran]

Hi Tuan, 

 

Most welcome. We are glad to hear that the provided suggestions helped you. Please get back to us if you need any further assistance. 

    

Regards,    

Keerthana R.