Hi there,
I would like to slow down the rotation speed on desktop and touchscreen (mobile) of the 360° product images.
I tried to add this that I found in the support forum to my child-theme function.php file
but doesn’t work:
function basel_product_360_view() {
$images = basel_get_360_gallery_attachment_ids();
if( empty( $images ) ) return;
$id = rand(100,999);
$title = ”;
$frames_count = count( $images );
$images_js_string = ”;
?>
<div class=”product-360-button”>
<span><?php _e(‘360 product view’, ‘basel’); ?></span>
</div>
<div id=”product-360-view” class=”product-360-view-wrapper mfp-hide”>
<div class=”basel-threed-view threed-id-<?php echo esc_attr( $id ); ?>”>
<?php if ( ! empty( $title ) ): ?>
<h3 class=”threed-title”><span><?php echo ($title); ?></span></h3>
<?php endif ?>
<ul class=”threed-view-images”>
<?php if ( count($images) > 0 ): ?>
<?php $i=0; foreach ($images as $img_id): $i++; ?>
<?php
$img = wp_get_attachment_image_src( $img_id, ‘full’ );
$width = $img[1];
$height = $img[2];
$images_js_string .= “‘” . $img[0] . “‘”;
if( $i < $frames_count ) {
$images_js_string .= “,”;
}
?>
<?php endforeach ?>
<?php endif ?>
<div class=”spinner”>
<span>0%</span>
</div>
</div>
<script type=”text/javascript”>
jQuery(document).ready(function( $ ) {
$(‘.threed-id-<?php echo esc_attr( $id ); ?>’).ThreeSixty({
totalFrames: <?php echo $frames_count; ?>,
endFrame: <?php echo $frames_count; ?>,
currentFrame: 1,
imgList: ‘.threed-view-images’,
progress: ‘.spinner’,
imgArray: [<?php echo $images_js_string; ?>],
height: <?php echo $height ?>,
width: <?php echo $width ?>,
responsive: true,
playSpeed: 50,
navigation: true
});
});
</script>
</div>
<?php
}
Thank you for your help.
Best regards
.
