useParallax

类别

Sensors

导出大小

2.39 kB

最近修改

4 weeks ago

轻松创建视差效果。它使用 useDeviceOrientation，如果不支持方向，则回退到 useMouse。

🌐 Create parallax effect easily. It uses useDeviceOrientation and fallback to useMouse if orientation is not supported.

示例

源代码在线运行

roll: .nan
tilt: .nan
source: mouse

Credit of images to Jarom Vogel

用法

🌐 Usage

<script setup lang="ts">
import { useParallax } from '@vueuse/core'

const container = ref(null)
const { tilt, roll, source } = useParallax(container)
</script>

<template>
  <div ref="container" />
</template>