ngx-cursor-hover v0.0.12

ngx-cursor-hover (latest)

The CSS cursor property specifies the mouse cursor to be displayed when pointing over an element. It can be used to change the cursor to a variety of different shapes, such as a hand, a crosshair, or an arrow.

The cursor property is used to improve the user experience by providing visual cues about the actions that can be performed on an element. For example, a hand cursor is typically used to indicate that an element can be clicked, while a crosshair cursor is typically used to indicate that an element can be resized.

• ngxCursor Add directive to any HTML block element in order to enable cursor.

Import Style

• Import using CSS CDN and Add it to your application

<link rel="stylesheet" href="https://cdn.beforepost.com/neptune/ngx-cursor-hover-minified.css">

Add crossorigin attribute as (use-credentials or anonymous) to link element if required.

• Directly add it to your Css / Scss file.

@import url("https://cdn.beforepost.com/neptune/ngx-cursor-hover-minified.css");

Import

Import the module on your app.module.ts file as follow.

import { NgxCursorHoverModule} from "ngx-cursor-hover";

Add to imports

imports: [
  ...
  NgxCursorHoverModule
  ...
],

Core function

<div class="card-body" ngxCursor
  [cursor]="'cursor-name-from-below-table'">

    <!-- Content goes here... -->

</div>

Code integration

To use this package as a service npm i ngx-cursor-hover install this on the root angular project .

Note: Don't forget to run this commend npm i ngx-cursor-hover on root folder or else it will throw error.

Then import the module as follow on imports array

NgxResizeElementModule