What's the easiest way to add pause/play functionality by clicking anywhere in the video element similar to most video players?

I tried:

$('video').click(function() {

        if($(this).paused){

            $(this).play();

        } else {

            $(this).pause();

        }


    });

But it didn't like the $(this).pause() call. Any help is appreciated. Thanks.

DS

What's the easiest way to add pause/play functionality by clicking anywhere in the video element similar to most video players?

I tried:

$('video').click(function() {

        if($(this).paused){

            $(this).play();

        } else {

            $(this).pause();

        }


    });

But it didn't like the $(this).pause() call. Any help is appreciated. Thanks.

DS

• javascript
• onclick
• playback
• mediaelement.js

Share Improve this question Follow edited Mar 4, 2015 at 21:26 L84 46.3k5959 gold badges181181 silver badges259259 bronze badges asked Apr 14, 2011 at 18:45 DamnSemicolonDamnSemicolon 26111 gold badge33 silver badges1010 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

    $(".mejs-mediaelement").click(function(){
        if($(".mejs-overlay-play").css('display') == 'none'){
            $('video').each(function(){this.player.pause()});
        }
    });

just try it :)

$('video').click(function() {

        if(this.paused){

            this.play();

        } else {

            this.pause();

        }


    });

But, this won't work. You will want to float an invisible div (with an invisible PNG in it) over the video to receive the click mands.

Or you can use a solution like http://videojs./