Open and play various audio / video files in modal using [login to view URL] and foundation
$30-250 USD
Paguhet në dorëzim
I have a grid of audio files and youtube videos. These will be represented in the grid as images, when user clicks on an image, it should load a modal (using foundation reveal modal) and AUTOPLAY the selected audio or video.
When user closes the modal (this is already a callback in the js provided below and I put in a [login to view URL] to show where), any playing audio/video should stop.
If user then clicks on a new audio or video the modal should open with new audio / video playing.
A basic skeleton example is here with just a few files for reference / testing:
[login to view URL]
Note: the real site will have 20-30 random files, so I want to build and destroy the modal on click, not create 30 modals on page load.
Using PLYR to handle audio / video controls:
[login to view URL]
And Foundation Reveal for the modal (since the site is built on foundation):
[login to view URL]
In the example I provided I swapped out the SRC using JS grabbing a data attr of the clicked item. I think there are better ways to initialize plyr within the modal based on what the user clicks.
I also couldn't get the items to stop and need to get the audio player loading in the modal if audio is selected. I have 2 modals but could easily just be one modal template if that's all that is needed.
NOTE: It looks like codepen will not play youtube videos at all, so might be easier to grab the code and put on a dev server for testing play / pause.
You may nee
ID Projekti: #35462167
Rreth projektit
Është zgjedhur fitues:
❤️Hi there❤️ I have read your job carefully and am confident to deliver you a perfect result as I am an expert. Let’s discuss details over chat. Looking forward to hearing from you. Best regards!
7 profesionistë freelancer dërguan një ofertë mesatare prej $116 për këtë punë
Hello , I just read your job posting and it sounds like you need JavaScript, HTML5, HTML, jQuery / Prototype and CSS. I am a senior developer and have been working in this field 4+ years. I'm very interested in your jo Më shumë
Dear client. I`m a full stack web developer with over 5 years hands-on experience and I`m specifically PROFICIENT in Javascript. Being prompt and punctual is the key point to makes me standing out and I can start work Më shumë