Menu icon Foundation
Pause audio/video when tabs toggle?

I've got a simple Tabs setup with 2 tabs. One contains an audio player (haven't settled on a specific one, though I'm partial to MediaElement.js), the other, an embedded YouTube video. Both have the same content and length - it's just that one is audio-only.

If the video is playing in the active tab, and the user switches tabs, then in an absolutely ideal world, events would flow as follows:

- The video would pause
- The timestamp would be stored
- Once the audio tab becomes active, the audio player would begin playback at around 5 seconds earlier than the stored video timestamp.

Ideally, the same thing would happen for the audio -> video switch.

Like I said, that would be an absolutely ideal situation. I'll settle for merely pausing whatever's currently playing when tabs switch. :p

Ideas?

tabsyoutubeplayback

I've got a simple Tabs setup with 2 tabs. One contains an audio player (haven't settled on a specific one, though I'm partial to MediaElement.js), the other, an embedded YouTube video. Both have the same content and length - it's just that one is audio-only.

If the video is playing in the active tab, and the user switches tabs, then in an absolutely ideal world, events would flow as follows:

- The video would pause
- The timestamp would be stored
- Once the audio tab becomes active, the audio player would begin playback at around 5 seconds earlier than the stored video timestamp.

Ideally, the same thing would happen for the audio -> video switch.

Like I said, that would be an absolutely ideal situation. I'll settle for merely pausing whatever's currently playing when tabs switch. :p

Ideas?

Michael C. over 4 years ago

Thanks for the links, Rafi. After a bunch of work, I've got the basic aspects working - switching tabs pauses one player and plays the other one from the timestamp -5s.

However, I'm having major issues with the fine-tuning... without going into details, it appears that Foundation only has a 'toggled' (i.e. after the tab switches) event, whereas I need to hook into a 'toggle' event - one that triggers before the tab switches.

Any ideas?

abarran over 1 year ago

I have also suffered from this. And thank you very much

abarran over 1 year ago

Free audio editing on your phone, click here

vickyjame about 1 year ago

Thank for your writting. If the phone does not yet have a sound, the appropriate ringtone I would recommend to people who download ringtones for free https://ringtonemob.net/

ancoll 23 days ago

There are lots of great ringtones at Ring320kbps.com and you can download them for free anytime.