Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1441926

    Hello,
    is it possible to install a “random-image”-function?
    This means that the background image of a section should change each time the page is reloaded from a previously defined set of images.

    Thanks for help :)

    #1441983

    give a unique ID to your color-section – here in my case it was: randomized
    this is for only one page of mine so there is the is_page conditional.
    upload the images via ftp into a given folder ( here it is a folder on uploads-folder: random-images
    then put only the image-filenames into the array.

    function randomize_bg_image() {
    if(is_page(34024)){ 
    ?>
    <script type="text/javascript">
    (function($){
    	    var images = ['o2-7.jpg', 'o2-1.jpg', 'o2-2.jpg', 'o2-3.jpg', 'o2-4.jpg', 'o2-5.jpg', 'o2-6.jpg'];
    	    $('#randomized').css({
    	    	'background-image': 'url(/wp-content/uploads/random-images/' + images[Math.floor(Math.random() * images.length)] + ')'
    	    });
    })(jQuery);
    </script>
    <?php
    }
    }
    add_action( 'wp_footer', 'randomize_bg_image' );

    see: https://webers-testseite.de/bg-scheduling/

    #1441987

    Hi,

    Thanks for helping out @guenni007, did you have any luck with that @xela?

    Best regards,
    Rikard

    #1442145

    Hi, thanks, this is great and it works.

    One other thing: now the image is always shown full in 100% size. Can I use the CCS “background-size: contain;” to show the whole image? And where would I put this snippet in?

    Thanks again!

    #1442150

    – oh, I see, I can just manage this in formatting the “#randomized”-tag. THANKS!

    #1442193

    Hi,
    Glad Guenni007 could help, thank you Guenni007, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Random (Background) image’ is closed to new replies.