When I use "slide" back to the former page ,Chrome displays blank.

When I use "slide" back to the former page ,Chrome displays blank.

I am developing a mobile web app .To imitate the native app swipe effect，I used the "slide"  of transitions to change the page, but I have found when the program runs in Chrome ,  it will display blank after the page2 swipe to the page1 , this issue only appears in Chrome, and the other transition effects are  normal .

My code is following, and my English is poor, I don't know whether I express myself clearly. 

  2. <!doctype html>
  3. <html>
  4.  <head>
  5.  <meta charset="UTF-8">
  6.  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,minimum-scale=1,user-scalable=no">
  7.  <meta name="apple-mobile-web-app-capable" content="yes">
  8.  <title>demo</title>
  9.  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
  10.  <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script><script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
  11.  <script >
  12. $(function(){
  13.         $("#slide1").on("click",
  14.         function() {
  15.                 $.mobile.changePage("#slide2", {
  16.                         transition: "slide",
  17.                 });
  18.         });
  19. $("#slide2").on("click",
  20.         function() {
  21.                 $.mobile.changePage("#slide1", {
  22.                         transition: "slide",
  23.                         reverse: true,
  24.                 });
  25.         });
  26.        });
  27.  </script>
  28.  </head>
  29. <body>

  31. <div  data-role="page" id="slide1" >SLIDE1 </div>
  32. <div data-role="page" id="slide2" > SLIDE2 </div>
  33. </body>
  34. </html>