Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Framework Basics Build a Website with Bootstrap Adding the Video Modal and Footer

Ryan Holm
seal-mask
.a{fill-rule:evenodd;}techdegree
Ryan Holm
Front End Web Development Techdegree Student 12,726 Points

Video Modal

I'm having issues getting the video to load properly. Window pops-up, video doesn't display.

Looking at the URL structure, I'm missing a question mark that treehouse has and I do not. Is this the issue? How to fix?

Thanks for your input!

Treehouse index.html?#videoModal

Me index.html#videoModal

<div class="row"> <div class="col-sm-6 hidden-xs"> <h3>Learn how to make this app for yourself</h3> <p> We will build on the concepts learned in previous iOS projects to create an app that will allow users to send photo or video messages to other users that will be deleted once viewed. </p> <div class="row th-copy"> <div class="col-sm-6"> <a data-toggle="modal" href="#videoModal"> <img class="img-responsive img-rounded" src="img/thumb_ribbit.jpg"> </a> </div> <div class="col-sm-5"> <p><em>Get access to courses for only $24 a month!</em></p> <a href="#">Visit Treehouse Ā»</a> </div> </div> </div>

<!-- Video Modal -->
<div class="modal fade" id="videoModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" date-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Learn how to make this app!</h4>
      </div>
      <div class="modal-body">
        <iframe width="500" height="281" src"http://www.youtube.com/embed/hTf0CgRC1_Q" frameborder="0"></iframe>
      </div>
    </div>
  </div>
</div>
<!-- End Video Modal -->
Marin Gerov
Marin Gerov
28,501 Points

Hey Ryan,

Seems to me that you are missing the "=" sign after the src attribute in the iframe tag. It should be: <iframe width="500" height="281" src="http://www.youtube.com/embed/hTf0CgRC1_Q" frameborder="0"></iframe>

2 Answers

Marin Gerov
Marin Gerov
28,501 Points

Hey Ryan,

Seems to me that you are missing the "=" sign after the src attribute in the iframe tag. It should be: <iframe width="500" height="281" src="http://www.youtube.com/embed/hTf0CgRC1_Q" frameborder="0"></iframe>