iscroll.css 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. @charset "utf-8";
  2. #wrapper {
  3. position: absolute;
  4. z-index: 1;
  5. top: 0px;
  6. bottom: 0px;
  7. left: 0;
  8. width: 100%;
  9. overflow: hidden;
  10. }
  11. #header {
  12. position:absolute;
  13. z-index:2;
  14. top: 82px;
  15. left:0;
  16. width:100%;
  17. height: 58px;
  18. line-height: 58px;
  19. background-color: #ffffff;
  20. background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #fff), color-stop(0.05, #fff), color-stop(1, #fff));
  21. background-image:-moz-linear-gradient(top, #fe96c9, #d51875 5%, #7b0a2e);
  22. background-image:-o-linear-gradient(top, #fe96c9, #d51875 5%, #7b0a2e);
  23. padding:0;
  24. color:#eee;
  25. font-size:20px;
  26. text-align:center;
  27. }
  28. .iScroller {
  29. position: absolute;
  30. z-index: 1;
  31. -webkit-tap-highlight-color: rgba(0,0,0,0);
  32. width: 100%;
  33. -webkit-transform: translateZ(0);
  34. -moz-transform: translateZ(0);
  35. -ms-transform: translateZ(0);
  36. -o-transform: translateZ(0);
  37. transform: translateZ(0);
  38. -webkit-touch-callout: none;
  39. -webkit-user-select: none;
  40. -moz-user-select: none;
  41. -ms-user-select: none;
  42. user-select: none;
  43. -webkit-text-size-adjust: none;
  44. -moz-text-size-adjust: none;
  45. -ms-text-size-adjust: none;
  46. -o-text-size-adjust: none;
  47. text-size-adjust: none;
  48. }
  49. /**
  50. *
  51. * Pull down/up styles
  52. *
  53. */
  54. .pullDown, .pullUp {
  55. background: transparent;
  56. height:40px;
  57. line-height:40px;
  58. padding:5px 10px;
  59. /* border-bottom:1px solid #ccc; */
  60. font-weight:bold;
  61. color: #888;
  62. margin-top:0;
  63. white-space: nowrap;
  64. font-size:14px;
  65. display: none;
  66. }
  67. .pullDown.scrolledUp{
  68. margin-top:-51px; /* Should match the totalt height (i.e. height + paddings + borders) of #pullDown set above */
  69. }
  70. .pullDown .pullDownLabel, .pullUp .pullUpLabel {
  71. margin: 0 5px;
  72. }
  73. .pullDown .pullDownIcon, .pullUp .pullUpIcon {
  74. display: inline-block;
  75. width:40px; height:40px;
  76. background:url(../images/pull-icon@2x.png) 0 0 no-repeat;
  77. -webkit-background-size:40px 80px; background-size:40px 80px;
  78. -webkit-transition-property:-webkit-transform;
  79. -webkit-transition-duration:250ms;
  80. vertical-align: middle;
  81. margin: 0 5px;
  82. }
  83. .pullDown .pullDownIcon {
  84. -webkit-transform:rotate(0deg) translateZ(0);
  85. }
  86. .pullUp .pullUpIcon {
  87. -webkit-transform:rotate(-180deg) translateZ(0);
  88. }
  89. .pullDown.flip .pullDownIcon {
  90. -webkit-transform:rotate(-180deg) translateZ(0);
  91. }
  92. .pullUp.flip .pullUpIcon {
  93. -webkit-transform:rotate(0deg) translateZ(0);
  94. }
  95. .pullDown.loading .pullDownIcon, .pullUp.loading .pullUpIcon {
  96. background-position:0 100%;
  97. -webkit-transform:rotate(0deg) translateZ(0);
  98. -webkit-transition-duration:0ms;
  99. -webkit-animation-name:loading;
  100. -webkit-animation-duration:2s;
  101. -webkit-animation-iteration-count:infinite;
  102. -webkit-animation-timing-function:linear;
  103. }
  104. @-webkit-keyframes loading {
  105. from { -webkit-transform:rotate(0deg) translateZ(0); }
  106. to { -webkit-transform:rotate(360deg) translateZ(0); }
  107. }
  108. .iScrollVerticalScrollbar{width:5px;}