iOS compatibility issue-transform

　　iOS compatibility issue-transform

Recently in a bug, the company is making a reader software, in the Reading page click on the navigation directory below, the directory can be left to right in the direction of the slow out, with the

Transform: translate (255px, 0px) translatez (0px);//directory appears

transform: translate (0px, 0px ) Translatez (0px);    //directory hidden

to display and hide the catalog. The Android phone is free to switch, and the page is normal but not on the iphone. To read on an Apple phone is to click on the table of contents and then in the Reading page, the screen to the right will appear white blank and the size of the directory consistent, and then I think it is the directory affected the reading page, I think it is because of the position location problem, It was originally position:relative, and then I changed to absolute; the blanks were gone; but a series of bug!!! were not.

So this solution doesn't work. A big mess .....

Then there was no way, I got rid of the $woread.transutil (". Rb_all,. Raad_box_ml", 0); So the toggle notation is the top transform changed to

The table of contents appears, the left side of the Reading page is positioned to the right of the directory

$ (". Raad_box_ml"). CSS ("left", "0px");
$ (". Rb_all"). CSS ("left", "255px");

Table of Contents hidden, left side of reading page positioned to left edge of screen

$ (". Raad_box_ml"). CSS ("left", " -255px"); The class,255px of the. Raad_box_ml directory is also the width of the directory
$ (". Rb_all"). CSS ("left", "0px"); . Rb_all class for the entire reading page (excluding directories)

This is compatible with both iOS and Android.

This problem bothered me for 3 days or so, I think transform is a bit incompatible under iOS. Perhaps I think wrong, have to know the great God can point out, humbly accept ~ ~ ~

iOS compatibility issue-transform