javascript - Changing an element with js toggle -



javascript - Changing an element with js toggle -

i made function, when click on link 'play', div black background changes iframe video. seems working fine. problem is, want add together multiple play links multiple videos. don't know how it, when click on sec play link, video changes first video sec in same place.

my code:

<script> var toggle = function() { var mydiv = document.getelementbyid('videoholder');document.getelementbyid("frame").src="http://www.youtube.com/embed/yuobzwf0aws"; if (mydiv.style.display === 'block' || mydiv.style.display === '') mydiv.style.display = 'none'; else mydiv.style.display = 'block' } </script> <a href="javascript:void(0)" onclick="toggle();">play</a><br> <div style="width:560px; height:315px; background-color:#111111;"> <div id="videoholder" style="display:none;"> <iframe id="frame" width="560" height="315" src="" frameborder="0" allowfullscreen></iframe> </div></div>

you seek this.

<script> function toggle(url) { var mydiv = document.getelementbyid('videoholder'); document.getelementbyid("frame").src = url; if (mydiv.style.display === 'block' || mydiv.style.display === '') { mydiv.style.display = 'none'; } else { mydiv.style.display = 'block' } } </script> <a href="javascript:void(0)" onclick="toggle('http://www.youtube.com/embed/yuobzwf0aws');">play 1</a><br> <a href="javascript:void(0)" onclick="toggle('http://www.youtube.com/embed/dqw4w9wgxcq');">play 2</a><br> <div style="width:560px; height:315px; background-color:#111111;"> <div id="videoholder" style="display:none;"> <iframe id="frame" width="560" height="315" src="" frameborder="0" allowfullscreen></iframe> </div></div>

javascript

Comments

Popular posts from this blog

xslt - DocBook 5 to PDF transform failing with error: "fo:flow" is missing child elements. Required content model: marker* -

mediawiki - How do I insert tables inside infoboxes on Wikia pages? -

Local Service User Logged into Windows -