Do not run autoplay video like bg on mobile

Navigation
0

My site has as bg a video that is in autoplay .

However, when on mobile, I want this video not to run, leaving only pause to show a background image.

If I put display:none in CSS it gets a bg black. 

<video nocontrols muted autoplay loop>
    <source src="video1.mp4" type="video/ogg">
    <source src="video1.mp4" type="video/mp4">
    <object data="video1.mp4"></object>
</video>

and in CSS mobile: 

video{ display:none }

Any suggestions?

    
asked by anonymous 23.05.2014 / 20:04

1 answer

1

Use CSS Media types to make the difference between mobile and desktop. remove the tag's loop directive and use Javascript (jQuery to facilitate) to place the attribute when needed.

Examples:

Html5 video loop and Jquery

    
24.05.2014 / 20:48
How to select a certain post in Wordpress? Problems with the gm (GraphicsMagick) module and node.js