By using Elementorforum.com’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Unofficial Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor


    Join us!
elementor official

HTML block with Java

Messiahs

Messiahs

New Member
Hi all

I uploaded a video with my problem to my webspace:
Code:
 http://cyberpunks.info/vid/elementor.mp4
I make a video overly with start,stop funktion.
I know, elemtor have his own embed video overlay, but it does not have the required function.
I want the overlay to be always visible.
The video should run under the frame.
Therefore i have my own solution with the html block and java code

In the elementor editor work my solution fine, but not in any browser.
I cant start the video.
Im confused, because in the editor works and in the browser not.

Here is the code in the HTML block if you need it.
Hope any can help me, thx !

Code:
<html>
<head>
<meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title>Unbenanntes Dokument</title>
<style type="text/css">
    .video {
    margin-top: 100px;
        width: 1000px;
}
.wrapper{
    display:table;
    width:auto;
    position:relative;
    width:50%;
}
.playpause {
    background-image:url(http://cyberpunks.info/wp-content/uploads/2020/12/Header_Hg.png);
    background-repeat:no-repeat;
    width:1500px;
    height:1500px;
    position:absolute;
    left:-20%;
    right:0%;
    top:30%;
    bottom:0%;
    margin:auto;
    background-size:contain;
    background-position: center;
}
</style>
</head>
<body>
<div class="wrapper">
    <video class="video">
        <source src="http://cyberpunks.info/vid/trailer.mp4" type="video/mp4" />
    </video>
  <div class="playpause"></div>
</div>
    <script>$('.video').parent().click(function (){if($(this).children(".video").get(0).paused){$(this).children(".video").get(0).play();   $(this).children(".playpause").fadeIn();
    }else{       $(this).children(".video").get(0).pause();
  $(this).children(".playpause").fadeIn();
    }
});</script>
</body>
</html>
 
elementor official

Latest posts

Latest Products

Other Elementor Resources

elementor official
elementor official
Top