Question

当我点击桌面上的playbutton / div时，它会消除div videotekst，但当我点击我的手机上的div时，div videotekst并没有消失。

这是我正在使用的代码：

<div class="overInreach">    <video id="my-video" class="video-js" controls preload="auto" width="100%" height="427px"
  poster="MY_VIDEO_POSTER.jpg" data-setup="{}" onended="videoEnded()">
    <source src="<?php echo get_template_directory_uri(); ?>/images/Inreach_Promo_v2.mp4" type='video/mp4'>
    <p class="vjs-no-js">
      To view this video please enable JavaScript, and consider upgrading to a web browser that
      <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
  </video>

  <script src="http://vjs.zencdn.net/5.8.8/video.js"></script>    <script>
        $(document).ready(function ()
        {
            $(".vjs-big-play-button").click(function ()
            {
                $("#videotekst").css("z-index", "-1");
        $(".vjs-big-play-button").css("display", "none !important");
        $(".vjs-control-bar").css("display", "flex !important");
            });
            $(".vjs-poster").click(function ()
            {
                $("#videotekst").css("z-index", "-1");
        $(".vjs-big-play-button").css("display", "none !important");
        $(".vjs-control-bar").css("display", "flex !important");
            });
        });
    </script>

    <script>
function videoEnded() {
    $("#videotekst").css("z-index", "1");
    $(".vjs-big-play-button").css("display", "block");
    $(".vjs-control-bar").css("display", "none");
}
    </script>

Answer 1

因为在移动设备中没有点击事件。那里有touchStart和touchEnd事件：

所以可以尝试：

var clickHandler = ('touchend' in document.documentElement ? "touchend" : "click");

$(".vjs-big-play-button").bind(clickHandler, function(e) {
    alert("clicked or tapped. This button used: " + clickHandler);
});

Div不会因手机上的onclick事件而消失吗？

1 个答案: