image.html 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <title></title>
  7. <link href="css/mui.min.css" rel="stylesheet" />
  8. <style>
  9. .mui-slider-indicator {
  10. position: absolute;
  11. bottom: 60px;
  12. width: 100%;
  13. text-align: center;
  14. background: 0 0
  15. }
  16. .mui-table-view-cell.mui-collapse .mui-collapse-content>.mui-slider {
  17. width: auto;
  18. height: auto;
  19. margin: 0px 0px
  20. }
  21. </style>
  22. <script src="js/mui.min.js"></script>
  23. </head>
  24. <body>
  25. <div class="mui-content">
  26. <div class="mui-slider">
  27. <div class="mui-slider-group">
  28. <div class="mui-slider-item">
  29. <a href="javascript:void(0);">
  30. <img src="images/English-qishiyendao1.jpg">
  31. </a>
  32. </div>
  33. <div class="mui-slider-item">
  34. <a href="javascript:void(0);">
  35. <img src="images/English-qishiyendao2.jpg">
  36. </a>
  37. </div>
  38. <div class="mui-slider-item" id="my-last-image-id">
  39. <a href="dragIndex.html">
  40. <img src="images/English-qishiyendao3.jpg">
  41. </a>
  42. </div>
  43. </div>
  44. <div class="mui-slider-indicator">
  45. <div class="mui-indicator mui-active"></div>
  46. <div class="mui-indicator"></div>
  47. <div class="mui-indicator"></div>
  48. </div>
  49. </div>
  50. </div>
  51. <script type="text/javascript">
  52. mui.plusReady(function() {
  53. plus.navigator.setFullscreen(true);
  54. mui('#my-last-image-id').on('tap', 'a', function() {
  55. plus.navigator.setFullscreen(false);
  56. mui.openWindow({
  57. id: 'dragIndex-wind',
  58. url: "dragIndex.html",
  59. show: {
  60. aniShow: "slide-in-top"
  61. }
  62. });
  63. });
  64. });
  65. </script>
  66. </body>
  67. </html>