diff --git a/examples/src/index.html b/examples/src/index.html index 2ed47af..83ceeb3 100644 --- a/examples/src/index.html +++ b/examples/src/index.html @@ -161,7 +161,6 @@
36 images, autoplay (desktop only), bottom 360 view circle, arrow keys support (desktop only), magnifier (desktop only), inner box shadow
diff --git a/examples/src/mobile.init.js b/examples/src/mobile.init.js index c4faf80..4fe5acc 100644 --- a/examples/src/mobile.init.js +++ b/examples/src/mobile.init.js @@ -17,6 +17,6 @@ if (isMobile) { 'data-folder', 'https://scaleflex.cloudimg.io/v7/https://cdn.scaleflex.it/demo/360-car/' ); - mercedes360View.setAttribute('data-ratio', '0.666'); + mercedes360View.setAttribute('data-ratio', '1.7'); mercedes360View.setAttribute('data-bottom-circle-offset', '22'); } \ No newline at end of file diff --git a/src/ci360.service.js b/src/ci360.service.js index edad764..f3942ec 100644 --- a/src/ci360.service.js +++ b/src/ci360.service.js @@ -730,7 +730,6 @@ import { const responsive = this.ciParams.ciToken; const firstImage = this.imagesX[0]; - this.updateContainerAndCanvasSize(firstImage); this.update(); this.speedFactor = getSpeedFactor(this.dragSpeed, this.amountX, this.container.offsetWidth); @@ -766,6 +765,7 @@ import { const ctx = this.canvas.getContext("2d"); ctx.scale(this.devicePixelRatio, this.devicePixelRatio); + this.updateContainerAndCanvasSize(image); if (this.fullscreenView) { const { width, height, offsetX, offsetY } = @@ -785,6 +785,7 @@ import { this.movingDirection ); } + ctx.drawImage(image, 0, 0, this.canvas.width, this.canvas.height); } }