# THREE.PositionalAudio and HTMLAudioElement

**URL:** <https://discourse.threejs.org/t/three-positionalaudio-and-htmlaudioelement/21446>\
**Category:** Questions\
**Tags:** web-audio, audio-loader, audio\
**Created:** [December 10, 2020, 4:44am UTC](https://discourse.threejs.org/t/three-positionalaudio-and-htmlaudioelement/21446 "2020-12-10T04:44:12Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Quan\_Le](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/quan_le/32/36133_2.png) [@Quan\_Le](https://discourse.threejs.org/u/Quan_Le)\
**Post date:** [December 10, 2020, 4:44am UTC](https://discourse.threejs.org/t/three-positionalaudio-and-htmlaudioelement/21446/1 "2020-12-10T04:44:12Z")

</div>

Hi everyone!

What is different between THREE.PositionalAudio and HTMLAudioElement?

I am working on a web app which has 3D model. Users are able to click on model and play clickSound.

What’s different between THREE.PositionalAudio:

`let soundListener = new THREE.AudioListener();`  
`audioLoader = new THREE.AudioLoader();`  
`let clickSound = new THREE.PositionalAudio(soundListener);`  
`audioLoader.load( 'assets/audio/click.mp3', function ( buffer ) {`  
`clickSound.setBuffer(buffer);`  
`clickSound.setRefDistance(20);`  
`clickSound.setLoop(false);`  
`clickSound.setVolume(10);`  
`clickSound.play();`  
});

and HTMLAudioElement:

`let clickSound = new Audio('assets/audio/click.mp3');`  
`clickSound.play().then(() => {});`

Thanks,

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [December 10, 2020, 8:59am UTC](https://discourse.threejs.org/t/three-positionalaudio-and-htmlaudioelement/21446/2 "2020-12-10T08:59:55Z")

</div>

`THREE.Audio` and `THREE.PositionalAudio` are based on the Web Audio API which has significant advantages over ordinary HTML 5 audio elements. I suggest you google this topic since there are many existing resources with comparison.

In general, for UI sound effects you want to use `THREE.Audio` (since spatialization is not required).

---

<div class="post-metadata">

**Author:** ![kohloth](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/kohloth/32/13376_2.png) [@kohloth](https://discourse.threejs.org/u/kohloth)\
**Post date:** [December 27, 2020, 12:10pm UTC](https://discourse.threejs.org/t/three-positionalaudio-and-htmlaudioelement/21446/3 "2020-12-27T12:10:54Z")

</div>

Is there any way to make a THREE.PositionalAudio object skip to a given play position (i.e. 5 seconds in.)

Trying to do this:

`console.log(music) // Three.PositionalAudio object`  
`music.context.currentTime = 5`

Throws an error saying that `currentTime` is read-only.

---

<div class="post-metadata">

**Author:** ![kohloth](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/kohloth/32/13376_2.png) [@kohloth](https://discourse.threejs.org/u/kohloth)\
**Post date:** [December 27, 2020, 1:10pm UTC](https://discourse.threejs.org/t/three-positionalaudio-and-htmlaudioelement/21446/4 "2020-12-27T13:10:58Z")

</div>

Ah, found the solution here: [https://threejs.org/docs/#api/en/audio/Audio](https://threejs.org/docs/#api/en/audio/Audio)  
I’ve used the `offset` property that THREE.PositionalAudio inherits from the THREE.Audio prototype.

`console.log(music); // Three.PositionalAudio object`  
`music.offset = 5;`  
`music.play() // Starts playing 5 seconds in`
