Masukan
Tampilan
Umpan Balik
Media
Media Player
Pemutar video dan audio dengan kendali sendiri: putar, gulir waktu, volume, kecepatan, teks, dan layar penuh.
0:00 / --:--
Spasi memutar dan menjeda, panah kiri dan kanan melompat, panah atas dan bawah mengatur volume, m menyenyapkan. Pemutarnya perlu difokuskan dulu — pintasan yang dipasang di dokumen akan menjeda video milik orang yang sedang menggulir halaman.
Untuk video, tukar MediaPlayerAudio dengan MediaPlayerVideo dan tambahkan MediaPlayerOverlay, MediaPlayerCaptions, MediaPlayerPip, serta MediaPlayerFullscreen — keempatnya menyembunyikan diri sendiri saat yang diputar bukan video atau peramban tidak mendukungnya.
Instalasi
bash
npx shadcn-vue@latest add https://kliping.pro/r/media-player.jsonPenggunaan
vue
<script setup lang="ts">
import { MediaPlayer, MediaPlayerAudio, MediaPlayerCaptions, MediaPlayerControls, MediaPlayerError, MediaPlayerFullscreen, MediaPlayerLoading, MediaPlayerOverlay, MediaPlayerPip, MediaPlayerPlay, MediaPlayerPlaybackSpeed, MediaPlayerSeek, MediaPlayerSeekButton, MediaPlayerTime, MediaPlayerVideo, MediaPlayerVolume } from '@/dice/media-player'
</script>Bagian
| Bagian | Berkas |
|---|---|
MediaPlayer | src/dice/media-player/MediaPlayer.vue |
MediaPlayerAudio | src/dice/media-player/MediaPlayerAudio.vue |
MediaPlayerCaptions | src/dice/media-player/MediaPlayerCaptions.vue |
MediaPlayerControls | src/dice/media-player/MediaPlayerControls.vue |
MediaPlayerError | src/dice/media-player/MediaPlayerError.vue |
MediaPlayerFullscreen | src/dice/media-player/MediaPlayerFullscreen.vue |
MediaPlayerLoading | src/dice/media-player/MediaPlayerLoading.vue |
MediaPlayerOverlay | src/dice/media-player/MediaPlayerOverlay.vue |
MediaPlayerPip | src/dice/media-player/MediaPlayerPip.vue |
MediaPlayerPlay | src/dice/media-player/MediaPlayerPlay.vue |
MediaPlayerPlaybackSpeed | src/dice/media-player/MediaPlayerPlaybackSpeed.vue |
MediaPlayerSeek | src/dice/media-player/MediaPlayerSeek.vue |
MediaPlayerSeekButton | src/dice/media-player/MediaPlayerSeekButton.vue |
MediaPlayerTime | src/dice/media-player/MediaPlayerTime.vue |
MediaPlayerVideo | src/dice/media-player/MediaPlayerVideo.vue |
MediaPlayerVolume | src/dice/media-player/MediaPlayerVolume.vue |
Asalnya
Ditulis ulang untuk Vue dari Dice UI, MIT, Copyright (c) 2024 Sadman Sakib. Rincian kewajiban lisensinya ada di halaman kredit.