Random Cacheable Header Image

<SCRIPT LANGUAGE="JavaScript">

    var theImages = new Array();

<?


$random_images = get_sub_field('random_images'); echo $random_images;


    $call_args = array(
        'post_type'        => 'attachment',
        'posts_per_page'   => 20,
        'post_status'      => 'any',
        'orderby'          => 'rand',
    );
 
	$call_args['tax_query'] = array(
		array(
			'taxonomy' => 'image_cats',
			'field'    => 'term_taxonomy_id',
			'terms'    => $random_images,
		),
	);
 
 
 
    $custom_query = new WP_Query( $call_args );
    $count = 0;
 
 
    if ( $custom_query->have_posts() ) : while ( $custom_query->have_posts() ) : $custom_query->the_post(); 
 
			$this_post_id=$post->ID;

			?>

            theImages[<?php echo $count; ?>] = '<?php echo wp_get_attachment_image_src( $this_post_id, 'full' )[0]; ?>';
		
			<?php $count++; ?>
 
 
 
 
           <?php endwhile; ?>
  
    <?php endif; wp_reset_query(); ?>
 

	var j = 0
	var p = theImages.length;
	var preBuffer = new Array()
	for (i = 0; i < p; i++){
	preBuffer[i] = new Image()
	preBuffer[i].src = theImages[i]
	}
	var whichImage = Math.round(Math.random()*(p-1));

	document.getElementById("header_with_overlay_block_<?php echo $mod_count; ?>").style.backgroundImage = "url('"+theImages[whichImage]+"')";

 
</script>

Comments