JSSOR Disable transform perspective

Question

The quality of my captions is horrible, the text is very blurry (like if you have text on a picture and then makes the picture bigger).

I noticed that if I remove the css:

transform: perspective(2000px);

The quality goes back to normal.

Why is JSSOR adding this to all of my captions and how can I disable it?

One simple solution (not the prettiest maybe) is to set transform to none in my external stylesheet and then also set it to !important. Is it the only one?

score 6 · Accepted Answer · answered Jun 30 '14 at 23:00

6

Please set $HWA option to false.

Btw, is there any demo that I can see the blurry text?

answered Jun 30 '14 at 23:00

jssor

6,995
2
18
21

This worked. I tried replicating the "bug" on a jsfiddle but there it worked as it should. On my page (where it doesn't work as it should) I am using a full width slider with the scale function (responsive). If I could PM you somewhere I could show you the actual page (not allowed to post it in public). – fgblomqvist Jul 01 '14 at 10:59
You may see something blurry when you scale small element bigger. But if you make the original slider big and scale it smaller, it should look more clear. – jssor Jul 01 '14 at 22:42
same thing happens to me, large image, scaled down, if HWA is set true I see blur the on image – Dimitar Marinov Oct 15 '14 at 11:51

Bijendra Ch · Answer 2 · 2016-07-01T06:56:50.043

0

  To avoid blurry text and remain slider responsive with jssor slider, 
  some   certain change is required in file name called 'jssor.utils.js'.

 In line 1045   transformValue += " perspective(2000px)"; 
  change to 
     transformValue += "none";

 And line 1092  elmt.style[GetTransformProperty(elmt)] = "perspective(2000px)"; 
 change to 
    elmt.style[GetTransformProperty(elmt)] = "none";

edited Jul 01 '16 at 06:56

answered Jul 01 '16 at 06:46

Bijendra Ch

417
3
4

This is not a good way to do it. It is much better to just turn off the HW acceleration as described by the developer himself. It does exactly what your solution does but in a supported and cleaner way, allowing you to update the plugin without having to redo anything. Please look into how to style your answers as well. – fgblomqvist Jul 01 '16 at 12:02

score -1 · Answer 3 · edited Jul 03 '15 at 07:42

-1

You can try style="transform: none !important; -webkit-transform: none !important;" write style inner div.

edited Jul 03 '15 at 07:42

AndrewPolland

3,041
4
28
39

answered Jul 03 '15 at 06:39

jeany

89
1
3

JSSOR Disable transform perspective

3 Answers3