43 lines
962 B
HTML
43 lines
962 B
HTML
{#if staticSrc === src}
|
|
<img class={className || ''}
|
|
aria-hidden={ariaHidden}
|
|
alt={alt || ''}
|
|
title={alt || ''}
|
|
{src}
|
|
on:imgLoad
|
|
on:imgLoadError />
|
|
{:else}
|
|
<img class="{className || ''} non-autoplay-zoom-in {isLink ? 'is-link' : ''}"
|
|
aria-hidden={ariaHidden}
|
|
alt={alt || ''}
|
|
title={alt || ''}
|
|
src={staticSrc}
|
|
on:imgLoad
|
|
on:imgLoadError
|
|
on:mouseover="onMouseOver(event)"
|
|
ref:node />
|
|
{/if}
|
|
<style>
|
|
.non-autoplay-zoom-in {
|
|
cursor: zoom-in;
|
|
}
|
|
.non-autoplay-zoom-in.is-link {
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
<script>
|
|
import { imgLoad, imgLoadError, mouseover } from '../_utils/events'
|
|
export default {
|
|
methods: {
|
|
onMouseOver (mouseOver) {
|
|
let { src, staticSrc } = this.get()
|
|
this.refs.node.src = mouseOver ? src : staticSrc
|
|
}
|
|
},
|
|
events: {
|
|
imgLoad,
|
|
imgLoadError,
|
|
mouseover
|
|
}
|
|
}
|
|
</script> |