Created
November 12, 2019 16:13
-
-
Save Fprince333/fe181d8d237b00c9761ba5a32c3d3d3d to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style type="text/css">.views-field-field-heading a { | |
| font-size: 20px; | |
| line-height: 26px; | |
| font-family: MarsCentra-Bold, sans-serif; | |
| color: #0000a0; | |
| padding-bottom: 7px; | |
| height: 52px; | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| display: -webkit-box; | |
| -webkit-box-orient: vertical; | |
| -webkit-line-clamp: 2; | |
| } | |
| .hero-billboard-image { | |
| height: auto; | |
| width: 100%; | |
| position: relative; | |
| overflow: hidden; | |
| top: 0; | |
| left: 0; | |
| background-color: #0000a0; | |
| } | |
| .hero-billboard-image video { | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| min-width: 100%; | |
| min-height: 100%; | |
| width: auto; | |
| height: auto; | |
| transform: translate(-50%, -50%); | |
| } | |
| .views-field.views-field-field-hero-video.hero-billboard-video video { | |
| object-fit: cover; | |
| height: 75vh; | |
| outline: none; | |
| width: 100%; | |
| } | |
| </style> | |
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/mobile-detect.min.js"></script><script> | |
| document.addEventListener("DOMContentLoaded", function() { | |
| var video = document.createElement('video'); | |
| video.autoplay = true; | |
| video.loop = true; | |
| video.muted = true; | |
| var sourceMP4 = document.createElement("source"); | |
| sourceMP4.type = "video/mp4"; | |
| sourceMP4.src = "https://gateway.mars.com/m/1277862a412a0f55/D8EB743A-Pledge-For-Planet-15sec.mp4"; | |
| video.appendChild(sourceMP4); | |
| var img = document.createElement("img"); | |
| img.alt = "Pledge for Planet"; | |
| img.src = "https://gateway.mars.com/m/bec563e3d6371d0/original/Pledge-For-Planet-Homepage-Preroll.gif"; | |
| var md = new MobileDetect(window.navigator.userAgent); | |
| if (!md.phone() && !md.tablet()) { | |
| $(".hero-billboard-image").css("min-height", "75vh"); | |
| $("#hero-billboard-preroll").replaceWith(video); | |
| $(".hero-billboard-image video").get(0).play(); | |
| } else { | |
| if (window.outerWidth >= 1200) { | |
| $(".hero-billboard-image").css("min-height", "75vh"); | |
| } | |
| $("#hero-billboard-preroll").replaceWith(img); | |
| } | |
| }); | |
| </script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment