Make sure, that every id is unique in your file. In the first place, because afterglow won't be able to identify the DOM nodes properly, in the second place because it's invalid HTML.

If you want more info, please share a link to a page where the problem occurs. Thanks.

amt_adam

Hey, I'm trying to embed two YouTube videos onto one page. However, when I input the second video's code neither of them work. I have tried taking out the 1st video's code and then the 2nd video works. I just tried sourcing the video from a local file for one of the videos and that seems to work. So, it seems to be that I cannot have two videos embeded from youtube on one page. Has anyone had this before? Or know why this might be happening?

Thanks,
amt_adam.

amt_adam

Okay, so I checked the id tag and they're all different. I wondered if the fact that I have the video in a divider with its own id would have an effect on the player but I tried deleting those and the videos still didn't want to play. Here's the hmtl code for all of the videos that are now on the site:

<!-- Showreel - Need to add back in autoplay when finished -->
<video class="afterglow" id="showreel" width="1280" height="720" loop="loop" data-volume=".5" src="videos/Libby Whitehouse - Recipe - Live Session V2.mp4"></video>
<!-- Projects Section -->
<div class="container">
<div class="head" id="projectshead">
<h1>Projects</h1>
<hr>
<p>We want you to rest easy knowing that we are the right people for you to trust your project in. Here we have some of our previous projects that you might like to take a look at to see the quality and attention to detail that we pride ourselves in.</p>
</div>
<!-- Project One -->
<div class="projects">
<div id="project_desc_one">
<h2>GOVER GAMES</h2>
<hr>
<p>Gover Gym invited us along to their annual "Gover Games" to shoot a promotional video for them. We used our professional equipment to create smooth glides and slow motion to really drive home the impact and power showcased at the event.</p>
</div>
<div id="project_vid_one">
<video class="afterglow" id="vid_one" width="1280" height="720" data-youtube-id="XI6P8ehgNIw"></video>
</div>
</div>
<!-- Project Two -->
<div class="projects">
<div id="project_desc_two">
<h2>SAM TOMPKINS</h2>
<hr>
<p>We created this music video to be used as promotion for "Bebe Rexha: The Ride" on MTV.<br><br>Sam Tompkins Social Media:<br><br>YouTube: 17K+ Twitter: 23K+ Instagram: 27K+</p>
</div>
<div id="project_vid_two">
<video class="afterglow" id="vid_two" width="1280" height="720" data-youtube-id="jMTgJKnwksw"></video>
</div>
</div>
<!-- Project Three -->
<div class="projects">
<div id="project_desc_three">
<h2>HEATHFIELD SHOW</h2>
<hr>
<p>Heathfield Show attracts, on average, 18,000 visitors from all over the South East to its agriculture event. They asked us to come along and encapsulate the show in a video. We wanted to focus on the heart of this event, agriculture, while also capturing the fun and games in aspects such as the monster truck show.</p>
</div>
<div id="project_vid_three">
<video class="afterglow" id="project_vid_three" width="1280" height="720" data-youtube-id="fGW6KiM8pYM"></video>
</div>

As you can see there are 4 videos, one of which is locally hosted video (which is the only one that works) and then the other 3 being grabbed from YouTube. Hope that this is enough to help you figure it out. Cheers.

amt_adam

Hey, not sure if this is allowed but just wanted to bump this thread just in case it's been forgotten about. Need to deliver the project soon and want to use the player but at the moment it looks like I might have to implement another one for the time being at least. Cheers.