react-magic-image-loader
Advanced tools
Comparing version
{ | ||
"name": "react-magic-image-loader", | ||
"version": "1.0.2", | ||
"version": "1.0.3", | ||
"description": "This image loader is designed to enhance the user experience with a captivating magical glitter animation during the loading phase. As the image progressively loads, subtle sparkling effects appear across the image, creating a sense of magic and wonder. This loader not only keeps users engaged but also adds an aesthetically pleasing touch, giving the loading process a smooth and enchanting visual flair.", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.js", |
@@ -26,3 +26,2 @@ # Image Loader | ||
```javascript | ||
import React from "react"; | ||
@@ -34,16 +33,16 @@ import logo from "./logo.svg"; | ||
function App() { | ||
return ( | ||
<div className="App"> | ||
<MagicLoader | ||
src={logo} // The source of the image | ||
alt="logo" // Alt text for the image | ||
stl={{ width: "100px", height: "100px" }} // Custom inline styles | ||
type="magic" // Loader type | ||
/> | ||
</div> | ||
); | ||
return ( | ||
<div className="App"> | ||
<MagicLoader | ||
src={logo} // The source of the image | ||
alt="logo" // Alt text for the image | ||
stl={{ width: "100px", height: "100px" }} // Custom inline styles | ||
type="magic" // Loader type | ||
/> | ||
</div> | ||
); | ||
} | ||
export default App; | ||
``` | ||
@@ -59,2 +58,5 @@ ## Props | ||
| `onClick` | func | `() => {}` | ❌ | Callback function when the image is clicked. | | ||
``` | ||
``` |
7444
0.89%60
3.45%