Video background

peppergroup's picture
peppergroup
Thu, 08/16/2018 - 09:58
#1
Video background

Hi, I just bought the latest MD-Slider module because I want to lay a video behind my 4-year-old MD_slider on our home page. Your advertisement for it says "you can add text, image or video and create fancy slider," but I don't see any option for a video background. Please tell me how to do this. Thank you.

cindy's picture
cindy
Thu, 08/16/2018 - 23:14

Hello,

Which version of MD Slider are you using? For Drupal7 or Drupal8?

- Drupal7: The newest version is 7.x-2.24. Please follow the follwing screenshot:

http://prntscr.com/kjlasf

- Drupal8: background video is not supported yet. We will add this feature in next version

Thank you!

peppergroup's picture
peppergroup
Fri, 08/17/2018 - 10:46

Thank you! I do have the latest and am using Drupal 7. Is there a way to have one video play underneath all slides without restarting at each slide?

cindy's picture
cindy
Sat, 08/18/2018 - 01:00

Hello.

Currently, we only support different video for each slide. One video for all slides is not supported yet

If you want that function, you can follow our following instruction:
(Note* You should save/back up this change to update in future versions of MD Slider)

+ Open file template: md_slider/templates/front/md_slider.tpl.php and add the following code:

<video class="bg-video-slider" playsinline autoplay muted loop >       <source src="http://thenewcode.com/assets/videos/polina.webm" type="video/webm"><source src="http://thenewcode.com/assets/videos/polina.mp4" type="video/mp4">   </video>

right under the code:

<?php endforeach;?>

http://prntscr.com/kk0ri0

+ Open file md_slider/js/md-slider.js, search function init and add the code below:

//load backgound video$('.bg-video-slider').trigger('load');

right under:

$(window).trigger('scroll');

http://prntscr.com/kk0tf2

In order to show one backgroud video for all slides at frontend, you please DO NOT set backround for all slides (image, video, color). You just insert slide objects (text, image, video) into slide. http://prntscr.com/kk0ueg
Then clear drupal cache and test at frontend. The background video plays correctly http://prntscr.com/kk0uqv

Log in or register to post comments
Have More Idea?

We are here to build your website!

No Universal solution fits all special business requirements. Our experienced team is ready with ideas and state-of-the-art technical solutions to consult the best solution within your budget.