Skip to content

Commit 950368f

Browse files
committed
docs: add information about the utility of this lib into the README + pictures + stackblitz demo
1 parent 23ce8d5 commit 950368f

File tree

1 file changed

+18
-0
lines changed

1 file changed

+18
-0
lines changed

README.MD

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,22 @@
11
# ngx-hover-opacity
2+
This librairy aims to provide a simple way to "disable" an entire HTML element.
3+
4+
For example, if you display a given resource and suddenly it is not available anymore (deleted on the server and you just received an event).
5+
Should you redirect the user to the home page? If he was reading it, it's a little brutal, isn't it?
6+
7+
Instead of that, you might want to take a breath and do not remove the element right away.
8+
Just hover it, with a nice opacity so the user cannot interact with it anymore.
9+
(Maybe you could also let him know what's happening with a message, but it's up to you).
10+
11+
## Demo:
12+
13+
ngx-hover-opacity set to **OFF**
14+
![An MdCard from material with ngx-hover-opacity set to OFF](https://user-images.githubusercontent.com/4950209/29740631-2ee2ca28-8a5b-11e7-9f61-19681ab07fbd.png)
15+
16+
ngx-hover-opacity set to **ON**
17+
![An MdCard from material with ngx-hover-opacity set to ON](https://user-images.githubusercontent.com/4950209/29740633-4446d972-8a5b-11e7-9c61-f231d40d803a.png)
18+
19+
You can also [try it live on Stackblitz!](https://stackblitz.com/edit/angular-se17ec)
220

321
## Installation
422

0 commit comments

Comments
 (0)