Friday, 19 April 2024

Auto Expand Side Navigation Menu On Mouse Hover in Apex

 Auto Expand Side Navigation Menu On Mouse Hover in Apex

Load this Script as JS in Static Application Files. Save this file with name (Function_and_Global_Variable_Declaration)

(function ($) {
    $(window).on('theme42ready', function () {
        if ($('.t-PageBody').hasClass('js-navExpanded')) {
            $('#t_Button_navControl').click();
        }
        $('.apex-side-nav .t-Body-nav').hover(
            function () {
                $('.t-PageBody:not(.js-navExpanded) #t_Button_navControl').click();
            },
            function () {
                $('#t_Button_navControl').click();
            }
        );
    });
})(apex.jQuery);

Now Open Sahredcomponent and click on User Interface Then Click on Navigation Menu
and select Collapse Mode as Icon Default and Collapsed by Default Should be Checked .

Now Click on Javascript and select Content Delivery Network as jQuery.
and Paste the JS File Path from Static Files in the 

File URLs.
#APP_IMAGES#Function_and_Global_Variable_Declaration.js

Then jQuery Migrate Radio On.

------------------------------------------------------------------------------------------------------------------------

Now go to Global Page of Application and create a Dynamic Action as Execute Javascript and Paste the Code

$('#t_Body_nav #t_TreeNav').on('click', 'ul li.a-TreeView-node div.a-TreeView-content:not(:has(a))', function(){
    $(this).prev('span.a-TreeView-toggle').click();
});

------------------------------------------------------------------------------------------------------------------------




No comments:

Post a Comment

Check Internet Connectivity on Local System

if (!navigator.onLine) {     showOfflineAlert(); } else {     // Set a strict 3-second network timeout threshold     const controller = new ...