![]() ![]() added support for video error event (display image when error).DEPRECATED Elements extension for Jarallax.slightly changed styles, applied to container and to parallaxed images.fixed bug with clip images in Safari v14.fixed video loop and image reset problem.additional styles for video elements (prevent click on video blocks).added GDPR compliance parameters to Youtube and Vimeo API calls (in video-workers library).added accessibility attributes to background videos (tabindex, aria-hidden).changed standard position for mobile devices to 'fixed' (working smoother).removed check for transform with vendor prefixes.removed clipContainer method, use modern clip-path styles instead.added new event callbacks to video extension: onVideoInsert, onVideoWorkerInit.dropped IE support (supported modern browsers only).added VideoWorker globally in video extension since some project uses it.$('.jarallax').jarallax('scroll') Changelog: jarallax(document.querySelectorAll('.jarallax'), method) The required CSS styles for the background image.jarallax , Add a parallax image to the container as follows. Load the jarallax plugin in the HTML page. With a fallback to background-position when CSS transforms are not supported. Available parameter with videoWorkerObject.Just another jQuery/JavaScript parallax plugin used for adding a smooth parallax scrolling effect to images, background images, Youtube/Vimeo/HTML5 videos and any HTML elements using CSS3 3D transforms (translate3d). Video can be accessed by this.$videoĬalled after VideoWorker script initialized. More info see below.Ĭalled right after video is inserted in the parallax block. The image will be set on the background.Įvents used the same way as Options. Preload videos only when it is visible on the screen.ĭisable video load on specific user agents (using regular expression) or with function return value. Play video only when it is visible on the screen. Start time in seconds when video will be started (this value will be applied also after loop).Įnd time in seconds when video will be ended. Also you can use data attribute data-jarallax-video. You can use Youtube, Vimeo or Self-Hosted videos. Will also contain the type of the video, for example jarallax-video jarallax-video-youtube Required jarallax/jarallax-video.js file. querySelectorAll ( '.jarallax' ), ) Additional options for video extension You can disable parallax effect and/or video background on mobile devices using option disableParallax and/or disableVideo. More info here - Issue 13.ĭisable parallax on specific user agents (using regular expression) or with function return value. Use custom DOM / jQuery element to check if parallax block in viewport. Keep tag in it's default place after Jarallax inited. Supported only background-position values. If you use tag for background, you should add object-position values, else use background-position values. If you use tag for background, you should add object-fit values, else use background-size values. Image tag that will be used as background. Scroll, scale, opacity, scroll-opacity, scale-opacity. Options can be passed in data attributes or in object when you initialize jarallax from script. This is only needed for maximum compatibility with all browsers. Note: self-hosted videos require 1 video type only, not necessarily using all mp4, webm, and ogv. We provide a version of Jarallax built as ESM ( and ) which allows you to use Jarallax as a module in your browser, if your targeted browsers support it. Use one of the following examples to import jarallax. There are a set of examples, which you can use as a starting point with Jarallax. ![]() ![]() We made WordPress plugin to easily add backgrounds for content in your blog with all Jarallax features. Supported tags, background images, YouTube, Vimeo and Self-Hosted Videos. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |