Is there a way to make a disabled element call the (mouseover) function?

I have a menu, that on mouseover opens sidemenus, that are opened as long as the mouse is either on the correct item of the menu or above the corresponding sidemenu. But only certain items in this menu are supposed to be enabled. Unfortunately if the item in a sidemenu is disabled it won't start the onmouseover function and the menu closes. Is there a way to have the item still call the mouseover function while being disabled? That's what I mean with menu and sidemenu

HTML

 <!--MainMenu-->
        <div class="menu">
            <div class="menu-item" *ngFor=" let item of this.menuservice.mainmenuItems">
                <button [disabled]="item.disabled"
                    (mouseover)="mouseMove(item.viewValue,true)" (mouseout)="mouseMove(item.viewValue,false)">
                    {{item.viewValue}}
                </button>
            </div>
        </div>

<!--Settings-->
            <div dHide [isHidden]="isSettingsMouseOver" class="side_menu" 
            (mouseover)="this.isSettingsMouseOver = true" (mouseout)="this.isSettingsMouseOver = false">
                <div class="menu-item" *ngFor=" let item of this.menuservice.settingsItems">
                    <button [disabled]="item.disabled">
                        {{item.viewValue}}
                    </button>
                </div>
            </div>

Script

isSettingsMouseOver: boolean = false;
mouseMove(id: string, enter: boolean) {
    if (id == 'Settings') {
      this.isSettingsMouseOver = enter;
    }
  }