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>