Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jul 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Change iframe source works once

    So, what I'm trying to do is change the source of an iframe, in this case a youtube vid. So I got the following:

    Code:
    <iframe width="640" height="360" id="youtube" src="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0" name="iframe" frameborder="0"></iframe>
    Now what I'm trying to do is: When a visitor clicks a link, the time of where the video is will change, like I want to go to 0:24 in the vid and let it autoplay, I use the following:
    Code:
    <a href="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0&autoplay=1#t=0m24s" target="iframe">0:24</a>
    But I want more links like that, so to go to 0:48 I use:
    Code:
    <a href="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0&autoplay=1#t=0m48s" target="iframe">0:48</a>
    Giving full code:
    Code:
    <a href="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0&autoplay=1#t=0m24s" target="iframe">0:24</a>
    <a href="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0&autoplay=1#t=0m48s" target="iframe">0:48</a>
    <iframe width="640" height="360" name="iframe" id="youtube" src="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0" frameborder="0" allowfullscreen></iframe>
    Now I can use this once, so I can click 0:24 or 0:48 and it will work, but when I click a link again, it won't do anything. I also tried placing the <a>'s after the iframe, but that won't change it. I also tried it with javascript before, but that gave me the same problem.

    My javascript code (please do notice I started with js today, so Im a giant noob):
    Code:
    <iframe width="640" height="360" name="iframe" id="youtube" src="http://www.youtube.com/embed/TZl6WpmYOR0?rel=0" frameborder="0" allowfullscreen></iframe>
    </div>
    <script type="text/javascript">
    function changeTime()
    {
    document.getElementById("youtube").src = "http://www.youtube.com/embed/TZl6WpmYOR0?rel=0&autoplay=1#t=0m24s";
    }
    </script>
    <script type="text/javascript">
    function changeTimer()
    {
    document.getElementById("youtube").src = "http://www.youtube.com/embed/TZl6WpmYOR0?rel=0&autoplay=1#t=0m48s";
    }
    </script>
    <button type="button" onclick="changeTime()">Go To 0:24</button>
    <button type="button" onclick="changeTimer()">Go To 0:48</button>
    Your help is appreciated.

  • #2
    New to the CF scene
    Join Date
    Jul 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay sorry guys, I found a solution on my own already

    Turns out you shouldn't use the #t0m24s thing for this, but the &start=24. If you do it like that, It works just fine. However, I do still think it's odd ;-)

  • #3
    New to the CF scene
    Join Date
    Jul 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    However, this seems to be quite heavy, as my browser gets stuck when I do this for like a 20 minute video with about 20 different timers.
    Is there a way to do this more lightly, so it will load faster?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •