Add Image component
This commit is contained in:
parent
9ed2a54ffc
commit
84dec24e1d
1 changed files with 17 additions and 0 deletions
17
src/components/Image.astro
Normal file
17
src/components/Image.astro
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
---
|
||||||
|
// Properties
|
||||||
|
const {
|
||||||
|
Source,
|
||||||
|
Alt
|
||||||
|
} = Astro.props
|
||||||
|
---
|
||||||
|
|
||||||
|
<img
|
||||||
|
src={Source}
|
||||||
|
alt={Alt}
|
||||||
|
onload="this.style.transition = '1s opacity'; this.style.opacity = '1'"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- Once the image is done loading, instead of cutting in, try to fade in instead. -->
|
||||||
|
<!-- See the `onload` script in the image tag. -->
|
||||||
|
<style>img {opacity: 0}</style>
|
Loading…
Reference in a new issue