qyg2297248353/svgl
qyg2297248353/svgl
1
0
Fork 0
mirror of https://github.com/pheralb/svgl.git synced 2025-02-06 15:17:58 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

♿️ Make card visibile for screen readers

Browse Source
This commit is contained in:
Miguel Ángel Durán 2024-01-17 19:22:38 +01:00
parent dd314719b4
commit fae5d8543b
1 changed files with 6 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/cardSpotlight.svelte
View File

@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
let div: HTMLDivElement; let domElement: HTMLElement;
let focused = false; let focused = false;
let position = { x: 0, y: 0 }; let position = { x: 0, y: 0 };
let opacity = 0; let opacity = 0;
const handleMouseMove = (e: MouseEvent) => { const handleMouseMove = (e: MouseEvent) => {
if (!div || focused) return; if (!domElement || focused) return;
const rect = div.getBoundingClientRect(); const rect = domElement.getBoundingClientRect();
position = { position = {
x: e.clientX - rect.left, x: e.clientX - rect.left,
@ -34,9 +34,8 @@
}; };
</script> </script>
<div <article
aria-hidden="true" bind:this={domElement}
bind:this={div}
on:mousemove={handleMouseMove} on:mousemove={handleMouseMove}
on:focus={handleFocus} on:focus={handleFocus}
on:blur={handleBlur} on:blur={handleBlur}
@ -52,4 +51,4 @@
`} `}
/> />
<slot /> <slot />
</div> </article>