From 94fa559883f76d905473bbff8ce9259b54072f73 Mon Sep 17 00:00:00 2001 From: daxhns Date: Fri, 7 Aug 2015 22:36:48 +0200 Subject: [PATCH] fix blurred image in chrome - Round translate parameters Added Math.round() around parameters for the translate to force them to whole numbers and not a decimal value. Since the unit is pixels, decimal values (for examle 20.5) create slightly blurred images (when in 100% zoomed state) in Chrome. --- js/zoom.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/js/zoom.js b/js/zoom.js index 31d8b0a..0d3dabc 100755 --- a/js/zoom.js +++ b/js/zoom.js @@ -183,9 +183,9 @@ var imageCenterY = imageOffset.top + (this._targetImage.height / 2) var imageCenterX = imageOffset.left + (this._targetImage.width / 2) - - this._translateY = viewportY - imageCenterY - this._translateX = viewportX - imageCenterX + + this._translateY = Math.round(viewportY - imageCenterY) + this._translateX = Math.round(viewportX - imageCenterX) $(this._targetImage).css('transform', 'scale(' + this._imgScaleFactor + ')') $(this._targetImageWrap).css('transform', 'translate(' + this._translateX + 'px, ' + this._translateY + 'px) translateZ(0)')