Tuesday, 28 March 2023

angular add a text mouse beside mouse

 https://stackoverflow.com/questions/46389002/how-to-listen-for-mousemove-event-on-document-object-in-angular

.compoent

    //

    @ViewChild('dummyContainer', { static: false }) dummyContainer: ElementRef;


    //

    @HostListener('document:mousemove', ['$event'])

    onMouseMove(e) {

        if (this.dummyContainer&& this.dummyContainer.hasOwnProperty('nativeElement')) {

            const x = e.offsetX,

                y = e.offsetY;

            this.dummyContainer.nativeElement.style.top = y + 10 + 'px';

            this.dummyContainer.nativeElement.style.left = x + 10 + 'px';

        }

    }

.scss

.dummy-container {

    position: absolute;

}

.html:

      <div

            class="dummy-container"

            #loadingContainer

        ><span >

                 test-123

            </span>

        </div>

No comments:

Post a Comment