SitePoint Sponsor

User Tag List

Results 1 to 5 of 5

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Apr 2013
    Location
    Istanbul,Turkey
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question adding image at the end of vimeo video when video is stopped

    hi,

    Code:
    <div id="videoContent" style="display:none"></div>
                   <img src="imajlar/PlayerPlay.png" id="playerPic" style="margin-top:52px; margin-left:322px;"/>
    my structure is like above.my jquery is:

    Code:
    $("#playerPic").on("click",function(){
    		$("#videoContent").append('<iframe width="900" height="350" id="vimeo" src="http://player.vimeo.com/video/41763950?api=1&player_id=player&amp;force_embed=1&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=1&amp;color=00adef&amp;fullscreen=1&amp;autoplay=1&amp;loop=0" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowfullscreen></iframe>');
    		$("#playerPic").hide();
    		$("iframe#vimeo").remove();
    		$("#playerPic").show();
    
    		});
    i'm trying to do that when video is stopped or paused,the image that i identified before will take place above the video.actually when video is stopped or paused,iframe should be hidden and image should be seen.how can i do this?

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,183
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    You will need to use the Vimeo player API in order to accomplish this as you can check the state of the video from within the iframe itself.

    http://developer.vimeo.com/player/js-api
    Blog/Portfolio | Evolution Xtreme | DFG Design | DFG Hosting | CSS-Tricks | Stack Overflow | Paul Irish
    Having lame problems with your code? Let us help by using a jsFiddle

  3. #3
    SitePoint Enthusiast
    Join Date
    Apr 2013
    Location
    Istanbul,Turkey
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i checked vimeo api already.i just want to show the image,that i putted before the video is also should be seen after the video ended.
    i mean when video is stopped,iframe should be hidden and img should be visible.

  4. #4
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,183
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    As I said already you won't be able to do this without using the Vimeo API as you can't detect when the finish is stopped from outside of 3rd party iframes.
    Blog/Portfolio | Evolution Xtreme | DFG Design | DFG Hosting | CSS-Tricks | Stack Overflow | Paul Irish
    Having lame problems with your code? Let us help by using a jsFiddle

  5. #5
    SitePoint Enthusiast
    Join Date
    Apr 2013
    Location
    Istanbul,Turkey
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i tried to check whether video is ended from iframe then i try to hide the iframe and show image but it did not work.
    probably i use wrong code at the wrong place


Bookmarks

Posting Permissions

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