javascript - PHP/CSS If page is loaded on mobile, only display JPG background -


so site, i'm using php call random gif background. on mobile, can quite resource intensive. how can make when person loads site on mobile, displays 'static01.jpg'.

php code calling background:

<?php $bg = array(     'page01.gif',      'page02.gif',      'page03.gif',      'page04.gif',      'page05.gif',      'page06.gif',      'page07.gif',      'page08.gif',      'page09.gif',      'page10.gif',      'page11.gif',      'page12.gif',      'page13.gif',      'page15.gif',      'page16.gif',      'page17.gif',      'page18.gif'  );  $i = rand(0, count($bg)-1);  $selectedbg = "$bg[$i]";  ?> 

css background code:

    background-image:     linear-gradient(to top,rgba(64,58,89,0.478),rgba(64,58,89,0.478)),     url(<?php echo $selectedbg; ?>); 

you can override css rule:

@media screen , (max-width: 680px) {     background-image:         linear-gradient(to top,rgba(64,58,89,0.478),rgba(64,58,89,0.478)),         url('static01.jpg'); } 

Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -