├── .browserslistrc ├── .gitignore ├── README.md ├── babel.config.js ├── note.txt ├── package.json ├── postcss.config.js ├── public ├── favicon.ico └── index.html ├── src ├── App.vue ├── assets │ ├── logo.png │ ├── styles │ │ ├── animate.css │ │ ├── border.styl │ │ ├── maoyan.css │ │ └── reset.css │ └── swiper.png ├── components │ └── movie_list │ │ ├── MovieButton.vue │ │ ├── MovieItem.vue │ │ └── MovieList.vue ├── main.js ├── mixins │ └── movie.js ├── mock │ └── city.json ├── pages │ ├── city │ │ └── City.vue │ ├── details │ │ └── Detail.vue │ ├── index │ │ └── Index.vue │ ├── movies │ │ ├── Comingsoon.vue │ │ ├── Intheater.vue │ │ ├── MostExpected.vue │ │ └── Movies.vue │ ├── profile │ │ └── Profile.vue │ └── theaters │ │ └── Theaters.vue ├── router.js ├── store │ └── store.js ├── utils │ ├── filters.js │ └── http.js └── views │ ├── About.vue │ └── Home.vue ├── vue.config.js └── yarn.lock /.browserslistrc: -------------------------------------------------------------------------------- 1 | > 1% 2 | last 2 versions 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | # local env files 6 | .env.local 7 | .env.*.local 8 | 9 | # Log files 10 | npm-debug.log* 11 | yarn-debug.log* 12 | yarn-error.log* 13 | 14 | # Editor directories and files 15 | .idea 16 | .vscode 17 | *.suo 18 | *.ntvs* 19 | *.njsproj 20 | *.sln 21 | *.sw? 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # maoyan 2 | 3 | ## 功能 4 | * 电影频道 5 | * 城市选择 6 | * 详情页 7 | 8 | ## 技术要点 9 | * 组件开发 10 | * 上拉加载 11 | * 动画切换 12 | * 滑动定位 13 | * 函数节流 14 | * 三级路由导航 15 | * 函数归并 16 | * 1px border 17 | * $nextTick 18 | * touch事件 19 | 20 | ## 前端技术架构 21 | * Vue-cli 22 | * Stylus 23 | * Vant 24 | * Vue-router 25 | * Vuex 26 | * BetterScroll 27 | * lodash 28 | * axios 29 | * animated.css 30 | * store.js 31 | * 单文件组件 32 | 33 | ## Project setup 34 | ``` 35 | yarn install 36 | ``` 37 | 38 | ### Compiles and hot-reloads for development 39 | ``` 40 | yarn run serve 41 | ``` 42 | 43 | ### Compiles and minifies for production 44 | ``` 45 | yarn run build 46 | ``` 47 | 48 | ### Run your tests 49 | ``` 50 | yarn run test 51 | ``` 52 | 53 | ### Lints and fixes files 54 | ``` 55 | yarn run lint 56 | ``` 57 | 58 | ### Customize configuration 59 | See [Configuration Reference](https://cli.vuejs.org/config/). 60 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@vue/app' 4 | ], 5 | 6 | "plugins": [ 7 | ["import", { 8 | "libraryName": "vant", 9 | "libraryDirectory": "es", 10 | "style": true 11 | }] 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /note.txt: -------------------------------------------------------------------------------- 1 | https://www.cnblogs.com/jszhp/p/9549706.html 2 | 3 | 2019-09-02： 4 | 1、stylus function(1px border) 5 | 2、vue.config.js 配置 resolve:alias 6 | 3、scope 穿透：多写一个style, stylus >>> 7 | 4、base64 8 | 5、二级路由 9 | 6、Vant(icon) 10 | 7、如何在CSS里定义iconfont的内容 省略&#x = \ ( 等于 \f002) 11 | 8、1px border 原理 12 | 13 | 14 | 2019-09-03: 15 | https://www.npmjs.com/package/axios 16 | http://www.axios-js.com/docs/ 17 | 18 | 19 | 2019-09-10 20 | 联调 21 | 前后端不分离的发布模式 22 | 前后端分离的发布模式 23 | 24 | lsof -i:80 25 | kill -9 pid 26 | 27 | windows: 28 | 1、启动nginx 29 | start nginx 30 | 2、停止nginx 31 | nginx -s stop 32 | 33 | mac: 34 | 1、启动nginx 35 | nginx 36 | 2、停止nginx 37 | nginx -s stop 38 | 39 | server { 40 | listen 80; 41 | server_name dev.gp12.cn; 42 | root /Users/felix/Desktop/workspace/gp-12/Vue.js/project/maoyan-be/public; 43 | index index.html; 44 | 45 | location ~* /ajax { 46 | proxy_pass http://localhost:3000; 47 | } 48 | 49 | location ~* /java { 50 | proxy_pass http://192.168.10.8:4000; 51 | } 52 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "maoyan", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve", 7 | "build": "vue-cli-service build" 8 | }, 9 | "dependencies": { 10 | "axios": "^0.19.0", 11 | "better-scroll": "^1.15.2", 12 | "core-js": "^2.6.5", 13 | "lodash": "^4.17.15", 14 | "store": "^2.0.12", 15 | "store.js": "^1.0.4", 16 | "vant": "^2.1.8", 17 | "vue": "^2.6.10", 18 | "vue-router": "^3.0.3", 19 | "vuex": "^3.0.1" 20 | }, 21 | "devDependencies": { 22 | "@vue/cli-plugin-babel": "^3.11.0", 23 | "@vue/cli-service": "^3.11.0", 24 | "babel-plugin-import": "^1.12.1", 25 | "stylus": "^0.54.5", 26 | "stylus-loader": "^3.0.2", 27 | "vue-template-compiler": "^2.6.10" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | autoprefixer: {} 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lurongtao/gp12-vue.js-maoyan/8b337c44859ce506ef807eaaa2ad78186bace255/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | maoyan 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 20 | -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lurongtao/gp12-vue.js-maoyan/8b337c44859ce506ef807eaaa2ad78186bace255/src/assets/logo.png -------------------------------------------------------------------------------- /src/assets/styles/animate.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | 3 | /*! 4 | * animate.css -https://daneden.github.io/animate.css/ 5 | * Version - 3.7.2 6 | * Licensed under the MIT license - http://opensource.org/licenses/MIT 7 | * 8 | * Copyright (c) 2019 Daniel Eden 9 | */ 10 | 11 | @-webkit-keyframes bounce { 12 | from, 13 | 20%, 14 | 53%, 15 | 80%, 16 | to { 17 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 18 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 19 | -webkit-transform: translate3d(0, 0, 0); 20 | transform: translate3d(0, 0, 0); 21 | } 22 | 23 | 40%, 24 | 43% { 25 | -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 26 | animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 27 | -webkit-transform: translate3d(0, -30px, 0); 28 | transform: translate3d(0, -30px, 0); 29 | } 30 | 31 | 70% { 32 | -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 33 | animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 34 | -webkit-transform: translate3d(0, -15px, 0); 35 | transform: translate3d(0, -15px, 0); 36 | } 37 | 38 | 90% { 39 | -webkit-transform: translate3d(0, -4px, 0); 40 | transform: translate3d(0, -4px, 0); 41 | } 42 | } 43 | 44 | @keyframes bounce { 45 | from, 46 | 20%, 47 | 53%, 48 | 80%, 49 | to { 50 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 51 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 52 | -webkit-transform: translate3d(0, 0, 0); 53 | transform: translate3d(0, 0, 0); 54 | } 55 | 56 | 40%, 57 | 43% { 58 | -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 59 | animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 60 | -webkit-transform: translate3d(0, -30px, 0); 61 | transform: translate3d(0, -30px, 0); 62 | } 63 | 64 | 70% { 65 | -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 66 | animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); 67 | -webkit-transform: translate3d(0, -15px, 0); 68 | transform: translate3d(0, -15px, 0); 69 | } 70 | 71 | 90% { 72 | -webkit-transform: translate3d(0, -4px, 0); 73 | transform: translate3d(0, -4px, 0); 74 | } 75 | } 76 | 77 | .bounce { 78 | -webkit-animation-name: bounce; 79 | animation-name: bounce; 80 | -webkit-transform-origin: center bottom; 81 | transform-origin: center bottom; 82 | } 83 | 84 | @-webkit-keyframes flash { 85 | from, 86 | 50%, 87 | to { 88 | opacity: 1; 89 | } 90 | 91 | 25%, 92 | 75% { 93 | opacity: 0; 94 | } 95 | } 96 | 97 | @keyframes flash { 98 | from, 99 | 50%, 100 | to { 101 | opacity: 1; 102 | } 103 | 104 | 25%, 105 | 75% { 106 | opacity: 0; 107 | } 108 | } 109 | 110 | .flash { 111 | -webkit-animation-name: flash; 112 | animation-name: flash; 113 | } 114 | 115 | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ 116 | 117 | @-webkit-keyframes pulse { 118 | from { 119 | -webkit-transform: scale3d(1, 1, 1); 120 | transform: scale3d(1, 1, 1); 121 | } 122 | 123 | 50% { 124 | -webkit-transform: scale3d(1.05, 1.05, 1.05); 125 | transform: scale3d(1.05, 1.05, 1.05); 126 | } 127 | 128 | to { 129 | -webkit-transform: scale3d(1, 1, 1); 130 | transform: scale3d(1, 1, 1); 131 | } 132 | } 133 | 134 | @keyframes pulse { 135 | from { 136 | -webkit-transform: scale3d(1, 1, 1); 137 | transform: scale3d(1, 1, 1); 138 | } 139 | 140 | 50% { 141 | -webkit-transform: scale3d(1.05, 1.05, 1.05); 142 | transform: scale3d(1.05, 1.05, 1.05); 143 | } 144 | 145 | to { 146 | -webkit-transform: scale3d(1, 1, 1); 147 | transform: scale3d(1, 1, 1); 148 | } 149 | } 150 | 151 | .pulse { 152 | -webkit-animation-name: pulse; 153 | animation-name: pulse; 154 | } 155 | 156 | @-webkit-keyframes rubberBand { 157 | from { 158 | -webkit-transform: scale3d(1, 1, 1); 159 | transform: scale3d(1, 1, 1); 160 | } 161 | 162 | 30% { 163 | -webkit-transform: scale3d(1.25, 0.75, 1); 164 | transform: scale3d(1.25, 0.75, 1); 165 | } 166 | 167 | 40% { 168 | -webkit-transform: scale3d(0.75, 1.25, 1); 169 | transform: scale3d(0.75, 1.25, 1); 170 | } 171 | 172 | 50% { 173 | -webkit-transform: scale3d(1.15, 0.85, 1); 174 | transform: scale3d(1.15, 0.85, 1); 175 | } 176 | 177 | 65% { 178 | -webkit-transform: scale3d(0.95, 1.05, 1); 179 | transform: scale3d(0.95, 1.05, 1); 180 | } 181 | 182 | 75% { 183 | -webkit-transform: scale3d(1.05, 0.95, 1); 184 | transform: scale3d(1.05, 0.95, 1); 185 | } 186 | 187 | to { 188 | -webkit-transform: scale3d(1, 1, 1); 189 | transform: scale3d(1, 1, 1); 190 | } 191 | } 192 | 193 | @keyframes rubberBand { 194 | from { 195 | -webkit-transform: scale3d(1, 1, 1); 196 | transform: scale3d(1, 1, 1); 197 | } 198 | 199 | 30% { 200 | -webkit-transform: scale3d(1.25, 0.75, 1); 201 | transform: scale3d(1.25, 0.75, 1); 202 | } 203 | 204 | 40% { 205 | -webkit-transform: scale3d(0.75, 1.25, 1); 206 | transform: scale3d(0.75, 1.25, 1); 207 | } 208 | 209 | 50% { 210 | -webkit-transform: scale3d(1.15, 0.85, 1); 211 | transform: scale3d(1.15, 0.85, 1); 212 | } 213 | 214 | 65% { 215 | -webkit-transform: scale3d(0.95, 1.05, 1); 216 | transform: scale3d(0.95, 1.05, 1); 217 | } 218 | 219 | 75% { 220 | -webkit-transform: scale3d(1.05, 0.95, 1); 221 | transform: scale3d(1.05, 0.95, 1); 222 | } 223 | 224 | to { 225 | -webkit-transform: scale3d(1, 1, 1); 226 | transform: scale3d(1, 1, 1); 227 | } 228 | } 229 | 230 | .rubberBand { 231 | -webkit-animation-name: rubberBand; 232 | animation-name: rubberBand; 233 | } 234 | 235 | @-webkit-keyframes shake { 236 | from, 237 | to { 238 | -webkit-transform: translate3d(0, 0, 0); 239 | transform: translate3d(0, 0, 0); 240 | } 241 | 242 | 10%, 243 | 30%, 244 | 50%, 245 | 70%, 246 | 90% { 247 | -webkit-transform: translate3d(-10px, 0, 0); 248 | transform: translate3d(-10px, 0, 0); 249 | } 250 | 251 | 20%, 252 | 40%, 253 | 60%, 254 | 80% { 255 | -webkit-transform: translate3d(10px, 0, 0); 256 | transform: translate3d(10px, 0, 0); 257 | } 258 | } 259 | 260 | @keyframes shake { 261 | from, 262 | to { 263 | -webkit-transform: translate3d(0, 0, 0); 264 | transform: translate3d(0, 0, 0); 265 | } 266 | 267 | 10%, 268 | 30%, 269 | 50%, 270 | 70%, 271 | 90% { 272 | -webkit-transform: translate3d(-10px, 0, 0); 273 | transform: translate3d(-10px, 0, 0); 274 | } 275 | 276 | 20%, 277 | 40%, 278 | 60%, 279 | 80% { 280 | -webkit-transform: translate3d(10px, 0, 0); 281 | transform: translate3d(10px, 0, 0); 282 | } 283 | } 284 | 285 | .shake { 286 | -webkit-animation-name: shake; 287 | animation-name: shake; 288 | } 289 | 290 | @-webkit-keyframes headShake { 291 | 0% { 292 | -webkit-transform: translateX(0); 293 | transform: translateX(0); 294 | } 295 | 296 | 6.5% { 297 | -webkit-transform: translateX(-6px) rotateY(-9deg); 298 | transform: translateX(-6px) rotateY(-9deg); 299 | } 300 | 301 | 18.5% { 302 | -webkit-transform: translateX(5px) rotateY(7deg); 303 | transform: translateX(5px) rotateY(7deg); 304 | } 305 | 306 | 31.5% { 307 | -webkit-transform: translateX(-3px) rotateY(-5deg); 308 | transform: translateX(-3px) rotateY(-5deg); 309 | } 310 | 311 | 43.5% { 312 | -webkit-transform: translateX(2px) rotateY(3deg); 313 | transform: translateX(2px) rotateY(3deg); 314 | } 315 | 316 | 50% { 317 | -webkit-transform: translateX(0); 318 | transform: translateX(0); 319 | } 320 | } 321 | 322 | @keyframes headShake { 323 | 0% { 324 | -webkit-transform: translateX(0); 325 | transform: translateX(0); 326 | } 327 | 328 | 6.5% { 329 | -webkit-transform: translateX(-6px) rotateY(-9deg); 330 | transform: translateX(-6px) rotateY(-9deg); 331 | } 332 | 333 | 18.5% { 334 | -webkit-transform: translateX(5px) rotateY(7deg); 335 | transform: translateX(5px) rotateY(7deg); 336 | } 337 | 338 | 31.5% { 339 | -webkit-transform: translateX(-3px) rotateY(-5deg); 340 | transform: translateX(-3px) rotateY(-5deg); 341 | } 342 | 343 | 43.5% { 344 | -webkit-transform: translateX(2px) rotateY(3deg); 345 | transform: translateX(2px) rotateY(3deg); 346 | } 347 | 348 | 50% { 349 | -webkit-transform: translateX(0); 350 | transform: translateX(0); 351 | } 352 | } 353 | 354 | .headShake { 355 | -webkit-animation-timing-function: ease-in-out; 356 | animation-timing-function: ease-in-out; 357 | -webkit-animation-name: headShake; 358 | animation-name: headShake; 359 | } 360 | 361 | @-webkit-keyframes swing { 362 | 20% { 363 | -webkit-transform: rotate3d(0, 0, 1, 15deg); 364 | transform: rotate3d(0, 0, 1, 15deg); 365 | } 366 | 367 | 40% { 368 | -webkit-transform: rotate3d(0, 0, 1, -10deg); 369 | transform: rotate3d(0, 0, 1, -10deg); 370 | } 371 | 372 | 60% { 373 | -webkit-transform: rotate3d(0, 0, 1, 5deg); 374 | transform: rotate3d(0, 0, 1, 5deg); 375 | } 376 | 377 | 80% { 378 | -webkit-transform: rotate3d(0, 0, 1, -5deg); 379 | transform: rotate3d(0, 0, 1, -5deg); 380 | } 381 | 382 | to { 383 | -webkit-transform: rotate3d(0, 0, 1, 0deg); 384 | transform: rotate3d(0, 0, 1, 0deg); 385 | } 386 | } 387 | 388 | @keyframes swing { 389 | 20% { 390 | -webkit-transform: rotate3d(0, 0, 1, 15deg); 391 | transform: rotate3d(0, 0, 1, 15deg); 392 | } 393 | 394 | 40% { 395 | -webkit-transform: rotate3d(0, 0, 1, -10deg); 396 | transform: rotate3d(0, 0, 1, -10deg); 397 | } 398 | 399 | 60% { 400 | -webkit-transform: rotate3d(0, 0, 1, 5deg); 401 | transform: rotate3d(0, 0, 1, 5deg); 402 | } 403 | 404 | 80% { 405 | -webkit-transform: rotate3d(0, 0, 1, -5deg); 406 | transform: rotate3d(0, 0, 1, -5deg); 407 | } 408 | 409 | to { 410 | -webkit-transform: rotate3d(0, 0, 1, 0deg); 411 | transform: rotate3d(0, 0, 1, 0deg); 412 | } 413 | } 414 | 415 | .swing { 416 | -webkit-transform-origin: top center; 417 | transform-origin: top center; 418 | -webkit-animation-name: swing; 419 | animation-name: swing; 420 | } 421 | 422 | @-webkit-keyframes tada { 423 | from { 424 | -webkit-transform: scale3d(1, 1, 1); 425 | transform: scale3d(1, 1, 1); 426 | } 427 | 428 | 10%, 429 | 20% { 430 | -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); 431 | transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); 432 | } 433 | 434 | 30%, 435 | 50%, 436 | 70%, 437 | 90% { 438 | -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); 439 | transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); 440 | } 441 | 442 | 40%, 443 | 60%, 444 | 80% { 445 | -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); 446 | transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); 447 | } 448 | 449 | to { 450 | -webkit-transform: scale3d(1, 1, 1); 451 | transform: scale3d(1, 1, 1); 452 | } 453 | } 454 | 455 | @keyframes tada { 456 | from { 457 | -webkit-transform: scale3d(1, 1, 1); 458 | transform: scale3d(1, 1, 1); 459 | } 460 | 461 | 10%, 462 | 20% { 463 | -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); 464 | transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); 465 | } 466 | 467 | 30%, 468 | 50%, 469 | 70%, 470 | 90% { 471 | -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); 472 | transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); 473 | } 474 | 475 | 40%, 476 | 60%, 477 | 80% { 478 | -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); 479 | transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); 480 | } 481 | 482 | to { 483 | -webkit-transform: scale3d(1, 1, 1); 484 | transform: scale3d(1, 1, 1); 485 | } 486 | } 487 | 488 | .tada { 489 | -webkit-animation-name: tada; 490 | animation-name: tada; 491 | } 492 | 493 | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ 494 | 495 | @-webkit-keyframes wobble { 496 | from { 497 | -webkit-transform: translate3d(0, 0, 0); 498 | transform: translate3d(0, 0, 0); 499 | } 500 | 501 | 15% { 502 | -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); 503 | transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); 504 | } 505 | 506 | 30% { 507 | -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); 508 | transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); 509 | } 510 | 511 | 45% { 512 | -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); 513 | transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); 514 | } 515 | 516 | 60% { 517 | -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); 518 | transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); 519 | } 520 | 521 | 75% { 522 | -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); 523 | transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); 524 | } 525 | 526 | to { 527 | -webkit-transform: translate3d(0, 0, 0); 528 | transform: translate3d(0, 0, 0); 529 | } 530 | } 531 | 532 | @keyframes wobble { 533 | from { 534 | -webkit-transform: translate3d(0, 0, 0); 535 | transform: translate3d(0, 0, 0); 536 | } 537 | 538 | 15% { 539 | -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); 540 | transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); 541 | } 542 | 543 | 30% { 544 | -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); 545 | transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); 546 | } 547 | 548 | 45% { 549 | -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); 550 | transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); 551 | } 552 | 553 | 60% { 554 | -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); 555 | transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); 556 | } 557 | 558 | 75% { 559 | -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); 560 | transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); 561 | } 562 | 563 | to { 564 | -webkit-transform: translate3d(0, 0, 0); 565 | transform: translate3d(0, 0, 0); 566 | } 567 | } 568 | 569 | .wobble { 570 | -webkit-animation-name: wobble; 571 | animation-name: wobble; 572 | } 573 | 574 | @-webkit-keyframes jello { 575 | from, 576 | 11.1%, 577 | to { 578 | -webkit-transform: translate3d(0, 0, 0); 579 | transform: translate3d(0, 0, 0); 580 | } 581 | 582 | 22.2% { 583 | -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); 584 | transform: skewX(-12.5deg) skewY(-12.5deg); 585 | } 586 | 587 | 33.3% { 588 | -webkit-transform: skewX(6.25deg) skewY(6.25deg); 589 | transform: skewX(6.25deg) skewY(6.25deg); 590 | } 591 | 592 | 44.4% { 593 | -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); 594 | transform: skewX(-3.125deg) skewY(-3.125deg); 595 | } 596 | 597 | 55.5% { 598 | -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); 599 | transform: skewX(1.5625deg) skewY(1.5625deg); 600 | } 601 | 602 | 66.6% { 603 | -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); 604 | transform: skewX(-0.78125deg) skewY(-0.78125deg); 605 | } 606 | 607 | 77.7% { 608 | -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); 609 | transform: skewX(0.390625deg) skewY(0.390625deg); 610 | } 611 | 612 | 88.8% { 613 | -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); 614 | transform: skewX(-0.1953125deg) skewY(-0.1953125deg); 615 | } 616 | } 617 | 618 | @keyframes jello { 619 | from, 620 | 11.1%, 621 | to { 622 | -webkit-transform: translate3d(0, 0, 0); 623 | transform: translate3d(0, 0, 0); 624 | } 625 | 626 | 22.2% { 627 | -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); 628 | transform: skewX(-12.5deg) skewY(-12.5deg); 629 | } 630 | 631 | 33.3% { 632 | -webkit-transform: skewX(6.25deg) skewY(6.25deg); 633 | transform: skewX(6.25deg) skewY(6.25deg); 634 | } 635 | 636 | 44.4% { 637 | -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); 638 | transform: skewX(-3.125deg) skewY(-3.125deg); 639 | } 640 | 641 | 55.5% { 642 | -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); 643 | transform: skewX(1.5625deg) skewY(1.5625deg); 644 | } 645 | 646 | 66.6% { 647 | -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); 648 | transform: skewX(-0.78125deg) skewY(-0.78125deg); 649 | } 650 | 651 | 77.7% { 652 | -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); 653 | transform: skewX(0.390625deg) skewY(0.390625deg); 654 | } 655 | 656 | 88.8% { 657 | -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); 658 | transform: skewX(-0.1953125deg) skewY(-0.1953125deg); 659 | } 660 | } 661 | 662 | .jello { 663 | -webkit-animation-name: jello; 664 | animation-name: jello; 665 | -webkit-transform-origin: center; 666 | transform-origin: center; 667 | } 668 | 669 | @-webkit-keyframes heartBeat { 670 | 0% { 671 | -webkit-transform: scale(1); 672 | transform: scale(1); 673 | } 674 | 675 | 14% { 676 | -webkit-transform: scale(1.3); 677 | transform: scale(1.3); 678 | } 679 | 680 | 28% { 681 | -webkit-transform: scale(1); 682 | transform: scale(1); 683 | } 684 | 685 | 42% { 686 | -webkit-transform: scale(1.3); 687 | transform: scale(1.3); 688 | } 689 | 690 | 70% { 691 | -webkit-transform: scale(1); 692 | transform: scale(1); 693 | } 694 | } 695 | 696 | @keyframes heartBeat { 697 | 0% { 698 | -webkit-transform: scale(1); 699 | transform: scale(1); 700 | } 701 | 702 | 14% { 703 | -webkit-transform: scale(1.3); 704 | transform: scale(1.3); 705 | } 706 | 707 | 28% { 708 | -webkit-transform: scale(1); 709 | transform: scale(1); 710 | } 711 | 712 | 42% { 713 | -webkit-transform: scale(1.3); 714 | transform: scale(1.3); 715 | } 716 | 717 | 70% { 718 | -webkit-transform: scale(1); 719 | transform: scale(1); 720 | } 721 | } 722 | 723 | .heartBeat { 724 | -webkit-animation-name: heartBeat; 725 | animation-name: heartBeat; 726 | -webkit-animation-duration: 1.3s; 727 | animation-duration: 1.3s; 728 | -webkit-animation-timing-function: ease-in-out; 729 | animation-timing-function: ease-in-out; 730 | } 731 | 732 | @-webkit-keyframes bounceIn { 733 | from, 734 | 20%, 735 | 40%, 736 | 60%, 737 | 80%, 738 | to { 739 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 740 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 741 | } 742 | 743 | 0% { 744 | opacity: 0; 745 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 746 | transform: scale3d(0.3, 0.3, 0.3); 747 | } 748 | 749 | 20% { 750 | -webkit-transform: scale3d(1.1, 1.1, 1.1); 751 | transform: scale3d(1.1, 1.1, 1.1); 752 | } 753 | 754 | 40% { 755 | -webkit-transform: scale3d(0.9, 0.9, 0.9); 756 | transform: scale3d(0.9, 0.9, 0.9); 757 | } 758 | 759 | 60% { 760 | opacity: 1; 761 | -webkit-transform: scale3d(1.03, 1.03, 1.03); 762 | transform: scale3d(1.03, 1.03, 1.03); 763 | } 764 | 765 | 80% { 766 | -webkit-transform: scale3d(0.97, 0.97, 0.97); 767 | transform: scale3d(0.97, 0.97, 0.97); 768 | } 769 | 770 | to { 771 | opacity: 1; 772 | -webkit-transform: scale3d(1, 1, 1); 773 | transform: scale3d(1, 1, 1); 774 | } 775 | } 776 | 777 | @keyframes bounceIn { 778 | from, 779 | 20%, 780 | 40%, 781 | 60%, 782 | 80%, 783 | to { 784 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 785 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 786 | } 787 | 788 | 0% { 789 | opacity: 0; 790 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 791 | transform: scale3d(0.3, 0.3, 0.3); 792 | } 793 | 794 | 20% { 795 | -webkit-transform: scale3d(1.1, 1.1, 1.1); 796 | transform: scale3d(1.1, 1.1, 1.1); 797 | } 798 | 799 | 40% { 800 | -webkit-transform: scale3d(0.9, 0.9, 0.9); 801 | transform: scale3d(0.9, 0.9, 0.9); 802 | } 803 | 804 | 60% { 805 | opacity: 1; 806 | -webkit-transform: scale3d(1.03, 1.03, 1.03); 807 | transform: scale3d(1.03, 1.03, 1.03); 808 | } 809 | 810 | 80% { 811 | -webkit-transform: scale3d(0.97, 0.97, 0.97); 812 | transform: scale3d(0.97, 0.97, 0.97); 813 | } 814 | 815 | to { 816 | opacity: 1; 817 | -webkit-transform: scale3d(1, 1, 1); 818 | transform: scale3d(1, 1, 1); 819 | } 820 | } 821 | 822 | .bounceIn { 823 | -webkit-animation-duration: 0.75s; 824 | animation-duration: 0.75s; 825 | -webkit-animation-name: bounceIn; 826 | animation-name: bounceIn; 827 | } 828 | 829 | @-webkit-keyframes bounceInDown { 830 | from, 831 | 60%, 832 | 75%, 833 | 90%, 834 | to { 835 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 836 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 837 | } 838 | 839 | 0% { 840 | opacity: 0; 841 | -webkit-transform: translate3d(0, -3000px, 0); 842 | transform: translate3d(0, -3000px, 0); 843 | } 844 | 845 | 60% { 846 | opacity: 1; 847 | -webkit-transform: translate3d(0, 25px, 0); 848 | transform: translate3d(0, 25px, 0); 849 | } 850 | 851 | 75% { 852 | -webkit-transform: translate3d(0, -10px, 0); 853 | transform: translate3d(0, -10px, 0); 854 | } 855 | 856 | 90% { 857 | -webkit-transform: translate3d(0, 5px, 0); 858 | transform: translate3d(0, 5px, 0); 859 | } 860 | 861 | to { 862 | -webkit-transform: translate3d(0, 0, 0); 863 | transform: translate3d(0, 0, 0); 864 | } 865 | } 866 | 867 | @keyframes bounceInDown { 868 | from, 869 | 60%, 870 | 75%, 871 | 90%, 872 | to { 873 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 874 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 875 | } 876 | 877 | 0% { 878 | opacity: 0; 879 | -webkit-transform: translate3d(0, -3000px, 0); 880 | transform: translate3d(0, -3000px, 0); 881 | } 882 | 883 | 60% { 884 | opacity: 1; 885 | -webkit-transform: translate3d(0, 25px, 0); 886 | transform: translate3d(0, 25px, 0); 887 | } 888 | 889 | 75% { 890 | -webkit-transform: translate3d(0, -10px, 0); 891 | transform: translate3d(0, -10px, 0); 892 | } 893 | 894 | 90% { 895 | -webkit-transform: translate3d(0, 5px, 0); 896 | transform: translate3d(0, 5px, 0); 897 | } 898 | 899 | to { 900 | -webkit-transform: translate3d(0, 0, 0); 901 | transform: translate3d(0, 0, 0); 902 | } 903 | } 904 | 905 | .bounceInDown { 906 | -webkit-animation-name: bounceInDown; 907 | animation-name: bounceInDown; 908 | } 909 | 910 | @-webkit-keyframes bounceInLeft { 911 | from, 912 | 60%, 913 | 75%, 914 | 90%, 915 | to { 916 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 917 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 918 | } 919 | 920 | 0% { 921 | opacity: 0; 922 | -webkit-transform: translate3d(-3000px, 0, 0); 923 | transform: translate3d(-3000px, 0, 0); 924 | } 925 | 926 | 60% { 927 | opacity: 1; 928 | -webkit-transform: translate3d(25px, 0, 0); 929 | transform: translate3d(25px, 0, 0); 930 | } 931 | 932 | 75% { 933 | -webkit-transform: translate3d(-10px, 0, 0); 934 | transform: translate3d(-10px, 0, 0); 935 | } 936 | 937 | 90% { 938 | -webkit-transform: translate3d(5px, 0, 0); 939 | transform: translate3d(5px, 0, 0); 940 | } 941 | 942 | to { 943 | -webkit-transform: translate3d(0, 0, 0); 944 | transform: translate3d(0, 0, 0); 945 | } 946 | } 947 | 948 | @keyframes bounceInLeft { 949 | from, 950 | 60%, 951 | 75%, 952 | 90%, 953 | to { 954 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 955 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 956 | } 957 | 958 | 0% { 959 | opacity: 0; 960 | -webkit-transform: translate3d(-3000px, 0, 0); 961 | transform: translate3d(-3000px, 0, 0); 962 | } 963 | 964 | 60% { 965 | opacity: 1; 966 | -webkit-transform: translate3d(25px, 0, 0); 967 | transform: translate3d(25px, 0, 0); 968 | } 969 | 970 | 75% { 971 | -webkit-transform: translate3d(-10px, 0, 0); 972 | transform: translate3d(-10px, 0, 0); 973 | } 974 | 975 | 90% { 976 | -webkit-transform: translate3d(5px, 0, 0); 977 | transform: translate3d(5px, 0, 0); 978 | } 979 | 980 | to { 981 | -webkit-transform: translate3d(0, 0, 0); 982 | transform: translate3d(0, 0, 0); 983 | } 984 | } 985 | 986 | .bounceInLeft { 987 | -webkit-animation-name: bounceInLeft; 988 | animation-name: bounceInLeft; 989 | } 990 | 991 | @-webkit-keyframes bounceInRight { 992 | from, 993 | 60%, 994 | 75%, 995 | 90%, 996 | to { 997 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 998 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 999 | } 1000 | 1001 | from { 1002 | opacity: 0; 1003 | -webkit-transform: translate3d(3000px, 0, 0); 1004 | transform: translate3d(3000px, 0, 0); 1005 | } 1006 | 1007 | 60% { 1008 | opacity: 1; 1009 | -webkit-transform: translate3d(-25px, 0, 0); 1010 | transform: translate3d(-25px, 0, 0); 1011 | } 1012 | 1013 | 75% { 1014 | -webkit-transform: translate3d(10px, 0, 0); 1015 | transform: translate3d(10px, 0, 0); 1016 | } 1017 | 1018 | 90% { 1019 | -webkit-transform: translate3d(-5px, 0, 0); 1020 | transform: translate3d(-5px, 0, 0); 1021 | } 1022 | 1023 | to { 1024 | -webkit-transform: translate3d(0, 0, 0); 1025 | transform: translate3d(0, 0, 0); 1026 | } 1027 | } 1028 | 1029 | @keyframes bounceInRight { 1030 | from, 1031 | 60%, 1032 | 75%, 1033 | 90%, 1034 | to { 1035 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 1036 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 1037 | } 1038 | 1039 | from { 1040 | opacity: 0; 1041 | -webkit-transform: translate3d(3000px, 0, 0); 1042 | transform: translate3d(3000px, 0, 0); 1043 | } 1044 | 1045 | 60% { 1046 | opacity: 1; 1047 | -webkit-transform: translate3d(-25px, 0, 0); 1048 | transform: translate3d(-25px, 0, 0); 1049 | } 1050 | 1051 | 75% { 1052 | -webkit-transform: translate3d(10px, 0, 0); 1053 | transform: translate3d(10px, 0, 0); 1054 | } 1055 | 1056 | 90% { 1057 | -webkit-transform: translate3d(-5px, 0, 0); 1058 | transform: translate3d(-5px, 0, 0); 1059 | } 1060 | 1061 | to { 1062 | -webkit-transform: translate3d(0, 0, 0); 1063 | transform: translate3d(0, 0, 0); 1064 | } 1065 | } 1066 | 1067 | .bounceInRight { 1068 | -webkit-animation-name: bounceInRight; 1069 | animation-name: bounceInRight; 1070 | } 1071 | 1072 | @-webkit-keyframes bounceInUp { 1073 | from, 1074 | 60%, 1075 | 75%, 1076 | 90%, 1077 | to { 1078 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 1079 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 1080 | } 1081 | 1082 | from { 1083 | opacity: 0; 1084 | -webkit-transform: translate3d(0, 3000px, 0); 1085 | transform: translate3d(0, 3000px, 0); 1086 | } 1087 | 1088 | 60% { 1089 | opacity: 1; 1090 | -webkit-transform: translate3d(0, -20px, 0); 1091 | transform: translate3d(0, -20px, 0); 1092 | } 1093 | 1094 | 75% { 1095 | -webkit-transform: translate3d(0, 10px, 0); 1096 | transform: translate3d(0, 10px, 0); 1097 | } 1098 | 1099 | 90% { 1100 | -webkit-transform: translate3d(0, -5px, 0); 1101 | transform: translate3d(0, -5px, 0); 1102 | } 1103 | 1104 | to { 1105 | -webkit-transform: translate3d(0, 0, 0); 1106 | transform: translate3d(0, 0, 0); 1107 | } 1108 | } 1109 | 1110 | @keyframes bounceInUp { 1111 | from, 1112 | 60%, 1113 | 75%, 1114 | 90%, 1115 | to { 1116 | -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 1117 | animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 1118 | } 1119 | 1120 | from { 1121 | opacity: 0; 1122 | -webkit-transform: translate3d(0, 3000px, 0); 1123 | transform: translate3d(0, 3000px, 0); 1124 | } 1125 | 1126 | 60% { 1127 | opacity: 1; 1128 | -webkit-transform: translate3d(0, -20px, 0); 1129 | transform: translate3d(0, -20px, 0); 1130 | } 1131 | 1132 | 75% { 1133 | -webkit-transform: translate3d(0, 10px, 0); 1134 | transform: translate3d(0, 10px, 0); 1135 | } 1136 | 1137 | 90% { 1138 | -webkit-transform: translate3d(0, -5px, 0); 1139 | transform: translate3d(0, -5px, 0); 1140 | } 1141 | 1142 | to { 1143 | -webkit-transform: translate3d(0, 0, 0); 1144 | transform: translate3d(0, 0, 0); 1145 | } 1146 | } 1147 | 1148 | .bounceInUp { 1149 | -webkit-animation-name: bounceInUp; 1150 | animation-name: bounceInUp; 1151 | } 1152 | 1153 | @-webkit-keyframes bounceOut { 1154 | 20% { 1155 | -webkit-transform: scale3d(0.9, 0.9, 0.9); 1156 | transform: scale3d(0.9, 0.9, 0.9); 1157 | } 1158 | 1159 | 50%, 1160 | 55% { 1161 | opacity: 1; 1162 | -webkit-transform: scale3d(1.1, 1.1, 1.1); 1163 | transform: scale3d(1.1, 1.1, 1.1); 1164 | } 1165 | 1166 | to { 1167 | opacity: 0; 1168 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 1169 | transform: scale3d(0.3, 0.3, 0.3); 1170 | } 1171 | } 1172 | 1173 | @keyframes bounceOut { 1174 | 20% { 1175 | -webkit-transform: scale3d(0.9, 0.9, 0.9); 1176 | transform: scale3d(0.9, 0.9, 0.9); 1177 | } 1178 | 1179 | 50%, 1180 | 55% { 1181 | opacity: 1; 1182 | -webkit-transform: scale3d(1.1, 1.1, 1.1); 1183 | transform: scale3d(1.1, 1.1, 1.1); 1184 | } 1185 | 1186 | to { 1187 | opacity: 0; 1188 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 1189 | transform: scale3d(0.3, 0.3, 0.3); 1190 | } 1191 | } 1192 | 1193 | .bounceOut { 1194 | -webkit-animation-duration: 0.75s; 1195 | animation-duration: 0.75s; 1196 | -webkit-animation-name: bounceOut; 1197 | animation-name: bounceOut; 1198 | } 1199 | 1200 | @-webkit-keyframes bounceOutDown { 1201 | 20% { 1202 | -webkit-transform: translate3d(0, 10px, 0); 1203 | transform: translate3d(0, 10px, 0); 1204 | } 1205 | 1206 | 40%, 1207 | 45% { 1208 | opacity: 1; 1209 | -webkit-transform: translate3d(0, -20px, 0); 1210 | transform: translate3d(0, -20px, 0); 1211 | } 1212 | 1213 | to { 1214 | opacity: 0; 1215 | -webkit-transform: translate3d(0, 2000px, 0); 1216 | transform: translate3d(0, 2000px, 0); 1217 | } 1218 | } 1219 | 1220 | @keyframes bounceOutDown { 1221 | 20% { 1222 | -webkit-transform: translate3d(0, 10px, 0); 1223 | transform: translate3d(0, 10px, 0); 1224 | } 1225 | 1226 | 40%, 1227 | 45% { 1228 | opacity: 1; 1229 | -webkit-transform: translate3d(0, -20px, 0); 1230 | transform: translate3d(0, -20px, 0); 1231 | } 1232 | 1233 | to { 1234 | opacity: 0; 1235 | -webkit-transform: translate3d(0, 2000px, 0); 1236 | transform: translate3d(0, 2000px, 0); 1237 | } 1238 | } 1239 | 1240 | .bounceOutDown { 1241 | -webkit-animation-name: bounceOutDown; 1242 | animation-name: bounceOutDown; 1243 | } 1244 | 1245 | @-webkit-keyframes bounceOutLeft { 1246 | 20% { 1247 | opacity: 1; 1248 | -webkit-transform: translate3d(20px, 0, 0); 1249 | transform: translate3d(20px, 0, 0); 1250 | } 1251 | 1252 | to { 1253 | opacity: 0; 1254 | -webkit-transform: translate3d(-2000px, 0, 0); 1255 | transform: translate3d(-2000px, 0, 0); 1256 | } 1257 | } 1258 | 1259 | @keyframes bounceOutLeft { 1260 | 20% { 1261 | opacity: 1; 1262 | -webkit-transform: translate3d(20px, 0, 0); 1263 | transform: translate3d(20px, 0, 0); 1264 | } 1265 | 1266 | to { 1267 | opacity: 0; 1268 | -webkit-transform: translate3d(-2000px, 0, 0); 1269 | transform: translate3d(-2000px, 0, 0); 1270 | } 1271 | } 1272 | 1273 | .bounceOutLeft { 1274 | -webkit-animation-name: bounceOutLeft; 1275 | animation-name: bounceOutLeft; 1276 | } 1277 | 1278 | @-webkit-keyframes bounceOutRight { 1279 | 20% { 1280 | opacity: 1; 1281 | -webkit-transform: translate3d(-20px, 0, 0); 1282 | transform: translate3d(-20px, 0, 0); 1283 | } 1284 | 1285 | to { 1286 | opacity: 0; 1287 | -webkit-transform: translate3d(2000px, 0, 0); 1288 | transform: translate3d(2000px, 0, 0); 1289 | } 1290 | } 1291 | 1292 | @keyframes bounceOutRight { 1293 | 20% { 1294 | opacity: 1; 1295 | -webkit-transform: translate3d(-20px, 0, 0); 1296 | transform: translate3d(-20px, 0, 0); 1297 | } 1298 | 1299 | to { 1300 | opacity: 0; 1301 | -webkit-transform: translate3d(2000px, 0, 0); 1302 | transform: translate3d(2000px, 0, 0); 1303 | } 1304 | } 1305 | 1306 | .bounceOutRight { 1307 | -webkit-animation-name: bounceOutRight; 1308 | animation-name: bounceOutRight; 1309 | } 1310 | 1311 | @-webkit-keyframes bounceOutUp { 1312 | 20% { 1313 | -webkit-transform: translate3d(0, -10px, 0); 1314 | transform: translate3d(0, -10px, 0); 1315 | } 1316 | 1317 | 40%, 1318 | 45% { 1319 | opacity: 1; 1320 | -webkit-transform: translate3d(0, 20px, 0); 1321 | transform: translate3d(0, 20px, 0); 1322 | } 1323 | 1324 | to { 1325 | opacity: 0; 1326 | -webkit-transform: translate3d(0, -2000px, 0); 1327 | transform: translate3d(0, -2000px, 0); 1328 | } 1329 | } 1330 | 1331 | @keyframes bounceOutUp { 1332 | 20% { 1333 | -webkit-transform: translate3d(0, -10px, 0); 1334 | transform: translate3d(0, -10px, 0); 1335 | } 1336 | 1337 | 40%, 1338 | 45% { 1339 | opacity: 1; 1340 | -webkit-transform: translate3d(0, 20px, 0); 1341 | transform: translate3d(0, 20px, 0); 1342 | } 1343 | 1344 | to { 1345 | opacity: 0; 1346 | -webkit-transform: translate3d(0, -2000px, 0); 1347 | transform: translate3d(0, -2000px, 0); 1348 | } 1349 | } 1350 | 1351 | .bounceOutUp { 1352 | -webkit-animation-name: bounceOutUp; 1353 | animation-name: bounceOutUp; 1354 | } 1355 | 1356 | @-webkit-keyframes fadeIn { 1357 | from { 1358 | opacity: 0; 1359 | } 1360 | 1361 | to { 1362 | opacity: 1; 1363 | } 1364 | } 1365 | 1366 | @keyframes fadeIn { 1367 | from { 1368 | opacity: 0; 1369 | } 1370 | 1371 | to { 1372 | opacity: 1; 1373 | } 1374 | } 1375 | 1376 | .fadeIn { 1377 | -webkit-animation-name: fadeIn; 1378 | animation-name: fadeIn; 1379 | } 1380 | 1381 | @-webkit-keyframes fadeInDown { 1382 | from { 1383 | opacity: 0; 1384 | -webkit-transform: translate3d(0, -100%, 0); 1385 | transform: translate3d(0, -100%, 0); 1386 | } 1387 | 1388 | to { 1389 | opacity: 1; 1390 | -webkit-transform: translate3d(0, 0, 0); 1391 | transform: translate3d(0, 0, 0); 1392 | } 1393 | } 1394 | 1395 | @keyframes fadeInDown { 1396 | from { 1397 | opacity: 0; 1398 | -webkit-transform: translate3d(0, -100%, 0); 1399 | transform: translate3d(0, -100%, 0); 1400 | } 1401 | 1402 | to { 1403 | opacity: 1; 1404 | -webkit-transform: translate3d(0, 0, 0); 1405 | transform: translate3d(0, 0, 0); 1406 | } 1407 | } 1408 | 1409 | .fadeInDown { 1410 | -webkit-animation-name: fadeInDown; 1411 | animation-name: fadeInDown; 1412 | } 1413 | 1414 | @-webkit-keyframes fadeInDownBig { 1415 | from { 1416 | opacity: 0; 1417 | -webkit-transform: translate3d(0, -2000px, 0); 1418 | transform: translate3d(0, -2000px, 0); 1419 | } 1420 | 1421 | to { 1422 | opacity: 1; 1423 | -webkit-transform: translate3d(0, 0, 0); 1424 | transform: translate3d(0, 0, 0); 1425 | } 1426 | } 1427 | 1428 | @keyframes fadeInDownBig { 1429 | from { 1430 | opacity: 0; 1431 | -webkit-transform: translate3d(0, -2000px, 0); 1432 | transform: translate3d(0, -2000px, 0); 1433 | } 1434 | 1435 | to { 1436 | opacity: 1; 1437 | -webkit-transform: translate3d(0, 0, 0); 1438 | transform: translate3d(0, 0, 0); 1439 | } 1440 | } 1441 | 1442 | .fadeInDownBig { 1443 | -webkit-animation-name: fadeInDownBig; 1444 | animation-name: fadeInDownBig; 1445 | } 1446 | 1447 | @-webkit-keyframes fadeInLeft { 1448 | from { 1449 | opacity: 0; 1450 | -webkit-transform: translate3d(-100%, 0, 0); 1451 | transform: translate3d(-100%, 0, 0); 1452 | } 1453 | 1454 | to { 1455 | opacity: 1; 1456 | -webkit-transform: translate3d(0, 0, 0); 1457 | transform: translate3d(0, 0, 0); 1458 | } 1459 | } 1460 | 1461 | @keyframes fadeInLeft { 1462 | from { 1463 | opacity: 0; 1464 | -webkit-transform: translate3d(-100%, 0, 0); 1465 | transform: translate3d(-100%, 0, 0); 1466 | } 1467 | 1468 | to { 1469 | opacity: 1; 1470 | -webkit-transform: translate3d(0, 0, 0); 1471 | transform: translate3d(0, 0, 0); 1472 | } 1473 | } 1474 | 1475 | .fadeInLeft { 1476 | -webkit-animation-name: fadeInLeft; 1477 | animation-name: fadeInLeft; 1478 | } 1479 | 1480 | @-webkit-keyframes fadeInLeftBig { 1481 | from { 1482 | opacity: 0; 1483 | -webkit-transform: translate3d(-2000px, 0, 0); 1484 | transform: translate3d(-2000px, 0, 0); 1485 | } 1486 | 1487 | to { 1488 | opacity: 1; 1489 | -webkit-transform: translate3d(0, 0, 0); 1490 | transform: translate3d(0, 0, 0); 1491 | } 1492 | } 1493 | 1494 | @keyframes fadeInLeftBig { 1495 | from { 1496 | opacity: 0; 1497 | -webkit-transform: translate3d(-2000px, 0, 0); 1498 | transform: translate3d(-2000px, 0, 0); 1499 | } 1500 | 1501 | to { 1502 | opacity: 1; 1503 | -webkit-transform: translate3d(0, 0, 0); 1504 | transform: translate3d(0, 0, 0); 1505 | } 1506 | } 1507 | 1508 | .fadeInLeftBig { 1509 | -webkit-animation-name: fadeInLeftBig; 1510 | animation-name: fadeInLeftBig; 1511 | } 1512 | 1513 | @-webkit-keyframes fadeInRight { 1514 | from { 1515 | opacity: 0; 1516 | -webkit-transform: translate3d(100%, 0, 0); 1517 | transform: translate3d(100%, 0, 0); 1518 | } 1519 | 1520 | to { 1521 | opacity: 1; 1522 | -webkit-transform: translate3d(0, 0, 0); 1523 | transform: translate3d(0, 0, 0); 1524 | } 1525 | } 1526 | 1527 | @keyframes fadeInRight { 1528 | from { 1529 | opacity: 0; 1530 | -webkit-transform: translate3d(100%, 0, 0); 1531 | transform: translate3d(100%, 0, 0); 1532 | } 1533 | 1534 | to { 1535 | opacity: 1; 1536 | -webkit-transform: translate3d(0, 0, 0); 1537 | transform: translate3d(0, 0, 0); 1538 | } 1539 | } 1540 | 1541 | .fadeInRight { 1542 | -webkit-animation-name: fadeInRight; 1543 | animation-name: fadeInRight; 1544 | } 1545 | 1546 | @-webkit-keyframes fadeInRightBig { 1547 | from { 1548 | opacity: 0; 1549 | -webkit-transform: translate3d(2000px, 0, 0); 1550 | transform: translate3d(2000px, 0, 0); 1551 | } 1552 | 1553 | to { 1554 | opacity: 1; 1555 | -webkit-transform: translate3d(0, 0, 0); 1556 | transform: translate3d(0, 0, 0); 1557 | } 1558 | } 1559 | 1560 | @keyframes fadeInRightBig { 1561 | from { 1562 | opacity: 0; 1563 | -webkit-transform: translate3d(2000px, 0, 0); 1564 | transform: translate3d(2000px, 0, 0); 1565 | } 1566 | 1567 | to { 1568 | opacity: 1; 1569 | -webkit-transform: translate3d(0, 0, 0); 1570 | transform: translate3d(0, 0, 0); 1571 | } 1572 | } 1573 | 1574 | .fadeInRightBig { 1575 | -webkit-animation-name: fadeInRightBig; 1576 | animation-name: fadeInRightBig; 1577 | } 1578 | 1579 | @-webkit-keyframes fadeInUp { 1580 | from { 1581 | opacity: 0; 1582 | -webkit-transform: translate3d(0, 100%, 0); 1583 | transform: translate3d(0, 100%, 0); 1584 | } 1585 | 1586 | to { 1587 | opacity: 1; 1588 | -webkit-transform: translate3d(0, 0, 0); 1589 | transform: translate3d(0, 0, 0); 1590 | } 1591 | } 1592 | 1593 | @keyframes fadeInUp { 1594 | from { 1595 | opacity: 0; 1596 | -webkit-transform: translate3d(0, 100%, 0); 1597 | transform: translate3d(0, 100%, 0); 1598 | } 1599 | 1600 | to { 1601 | opacity: 1; 1602 | -webkit-transform: translate3d(0, 0, 0); 1603 | transform: translate3d(0, 0, 0); 1604 | } 1605 | } 1606 | 1607 | .fadeInUp { 1608 | -webkit-animation-name: fadeInUp; 1609 | animation-name: fadeInUp; 1610 | } 1611 | 1612 | @-webkit-keyframes fadeInUpBig { 1613 | from { 1614 | opacity: 0; 1615 | -webkit-transform: translate3d(0, 2000px, 0); 1616 | transform: translate3d(0, 2000px, 0); 1617 | } 1618 | 1619 | to { 1620 | opacity: 1; 1621 | -webkit-transform: translate3d(0, 0, 0); 1622 | transform: translate3d(0, 0, 0); 1623 | } 1624 | } 1625 | 1626 | @keyframes fadeInUpBig { 1627 | from { 1628 | opacity: 0; 1629 | -webkit-transform: translate3d(0, 2000px, 0); 1630 | transform: translate3d(0, 2000px, 0); 1631 | } 1632 | 1633 | to { 1634 | opacity: 1; 1635 | -webkit-transform: translate3d(0, 0, 0); 1636 | transform: translate3d(0, 0, 0); 1637 | } 1638 | } 1639 | 1640 | .fadeInUpBig { 1641 | -webkit-animation-name: fadeInUpBig; 1642 | animation-name: fadeInUpBig; 1643 | } 1644 | 1645 | @-webkit-keyframes fadeOut { 1646 | from { 1647 | opacity: 1; 1648 | } 1649 | 1650 | to { 1651 | opacity: 0; 1652 | } 1653 | } 1654 | 1655 | @keyframes fadeOut { 1656 | from { 1657 | opacity: 1; 1658 | } 1659 | 1660 | to { 1661 | opacity: 0; 1662 | } 1663 | } 1664 | 1665 | .fadeOut { 1666 | -webkit-animation-name: fadeOut; 1667 | animation-name: fadeOut; 1668 | } 1669 | 1670 | @-webkit-keyframes fadeOutDown { 1671 | from { 1672 | opacity: 1; 1673 | } 1674 | 1675 | to { 1676 | opacity: 0; 1677 | -webkit-transform: translate3d(0, 100%, 0); 1678 | transform: translate3d(0, 100%, 0); 1679 | } 1680 | } 1681 | 1682 | @keyframes fadeOutDown { 1683 | from { 1684 | opacity: 1; 1685 | } 1686 | 1687 | to { 1688 | opacity: 0; 1689 | -webkit-transform: translate3d(0, 100%, 0); 1690 | transform: translate3d(0, 100%, 0); 1691 | } 1692 | } 1693 | 1694 | .fadeOutDown { 1695 | -webkit-animation-name: fadeOutDown; 1696 | animation-name: fadeOutDown; 1697 | } 1698 | 1699 | @-webkit-keyframes fadeOutDownBig { 1700 | from { 1701 | opacity: 1; 1702 | } 1703 | 1704 | to { 1705 | opacity: 0; 1706 | -webkit-transform: translate3d(0, 2000px, 0); 1707 | transform: translate3d(0, 2000px, 0); 1708 | } 1709 | } 1710 | 1711 | @keyframes fadeOutDownBig { 1712 | from { 1713 | opacity: 1; 1714 | } 1715 | 1716 | to { 1717 | opacity: 0; 1718 | -webkit-transform: translate3d(0, 2000px, 0); 1719 | transform: translate3d(0, 2000px, 0); 1720 | } 1721 | } 1722 | 1723 | .fadeOutDownBig { 1724 | -webkit-animation-name: fadeOutDownBig; 1725 | animation-name: fadeOutDownBig; 1726 | } 1727 | 1728 | @-webkit-keyframes fadeOutLeft { 1729 | from { 1730 | opacity: 1; 1731 | } 1732 | 1733 | to { 1734 | opacity: 0; 1735 | -webkit-transform: translate3d(-100%, 0, 0); 1736 | transform: translate3d(-100%, 0, 0); 1737 | } 1738 | } 1739 | 1740 | @keyframes fadeOutLeft { 1741 | from { 1742 | opacity: 1; 1743 | } 1744 | 1745 | to { 1746 | opacity: 0; 1747 | -webkit-transform: translate3d(-100%, 0, 0); 1748 | transform: translate3d(-100%, 0, 0); 1749 | } 1750 | } 1751 | 1752 | .fadeOutLeft { 1753 | -webkit-animation-name: fadeOutLeft; 1754 | animation-name: fadeOutLeft; 1755 | } 1756 | 1757 | @-webkit-keyframes fadeOutLeftBig { 1758 | from { 1759 | opacity: 1; 1760 | } 1761 | 1762 | to { 1763 | opacity: 0; 1764 | -webkit-transform: translate3d(-2000px, 0, 0); 1765 | transform: translate3d(-2000px, 0, 0); 1766 | } 1767 | } 1768 | 1769 | @keyframes fadeOutLeftBig { 1770 | from { 1771 | opacity: 1; 1772 | } 1773 | 1774 | to { 1775 | opacity: 0; 1776 | -webkit-transform: translate3d(-2000px, 0, 0); 1777 | transform: translate3d(-2000px, 0, 0); 1778 | } 1779 | } 1780 | 1781 | .fadeOutLeftBig { 1782 | -webkit-animation-name: fadeOutLeftBig; 1783 | animation-name: fadeOutLeftBig; 1784 | } 1785 | 1786 | @-webkit-keyframes fadeOutRight { 1787 | from { 1788 | opacity: 1; 1789 | } 1790 | 1791 | to { 1792 | opacity: 0; 1793 | -webkit-transform: translate3d(100%, 0, 0); 1794 | transform: translate3d(100%, 0, 0); 1795 | } 1796 | } 1797 | 1798 | @keyframes fadeOutRight { 1799 | from { 1800 | opacity: 1; 1801 | } 1802 | 1803 | to { 1804 | opacity: 0; 1805 | -webkit-transform: translate3d(100%, 0, 0); 1806 | transform: translate3d(100%, 0, 0); 1807 | } 1808 | } 1809 | 1810 | .fadeOutRight { 1811 | -webkit-animation-name: fadeOutRight; 1812 | animation-name: fadeOutRight; 1813 | } 1814 | 1815 | @-webkit-keyframes fadeOutRightBig { 1816 | from { 1817 | opacity: 1; 1818 | } 1819 | 1820 | to { 1821 | opacity: 0; 1822 | -webkit-transform: translate3d(2000px, 0, 0); 1823 | transform: translate3d(2000px, 0, 0); 1824 | } 1825 | } 1826 | 1827 | @keyframes fadeOutRightBig { 1828 | from { 1829 | opacity: 1; 1830 | } 1831 | 1832 | to { 1833 | opacity: 0; 1834 | -webkit-transform: translate3d(2000px, 0, 0); 1835 | transform: translate3d(2000px, 0, 0); 1836 | } 1837 | } 1838 | 1839 | .fadeOutRightBig { 1840 | -webkit-animation-name: fadeOutRightBig; 1841 | animation-name: fadeOutRightBig; 1842 | } 1843 | 1844 | @-webkit-keyframes fadeOutUp { 1845 | from { 1846 | opacity: 1; 1847 | } 1848 | 1849 | to { 1850 | opacity: 0; 1851 | -webkit-transform: translate3d(0, -100%, 0); 1852 | transform: translate3d(0, -100%, 0); 1853 | } 1854 | } 1855 | 1856 | @keyframes fadeOutUp { 1857 | from { 1858 | opacity: 1; 1859 | } 1860 | 1861 | to { 1862 | opacity: 0; 1863 | -webkit-transform: translate3d(0, -100%, 0); 1864 | transform: translate3d(0, -100%, 0); 1865 | } 1866 | } 1867 | 1868 | .fadeOutUp { 1869 | -webkit-animation-name: fadeOutUp; 1870 | animation-name: fadeOutUp; 1871 | } 1872 | 1873 | @-webkit-keyframes fadeOutUpBig { 1874 | from { 1875 | opacity: 1; 1876 | } 1877 | 1878 | to { 1879 | opacity: 0; 1880 | -webkit-transform: translate3d(0, -2000px, 0); 1881 | transform: translate3d(0, -2000px, 0); 1882 | } 1883 | } 1884 | 1885 | @keyframes fadeOutUpBig { 1886 | from { 1887 | opacity: 1; 1888 | } 1889 | 1890 | to { 1891 | opacity: 0; 1892 | -webkit-transform: translate3d(0, -2000px, 0); 1893 | transform: translate3d(0, -2000px, 0); 1894 | } 1895 | } 1896 | 1897 | .fadeOutUpBig { 1898 | -webkit-animation-name: fadeOutUpBig; 1899 | animation-name: fadeOutUpBig; 1900 | } 1901 | 1902 | @-webkit-keyframes flip { 1903 | from { 1904 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) 1905 | rotate3d(0, 1, 0, -360deg); 1906 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); 1907 | -webkit-animation-timing-function: ease-out; 1908 | animation-timing-function: ease-out; 1909 | } 1910 | 1911 | 40% { 1912 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1913 | rotate3d(0, 1, 0, -190deg); 1914 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1915 | rotate3d(0, 1, 0, -190deg); 1916 | -webkit-animation-timing-function: ease-out; 1917 | animation-timing-function: ease-out; 1918 | } 1919 | 1920 | 50% { 1921 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1922 | rotate3d(0, 1, 0, -170deg); 1923 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1924 | rotate3d(0, 1, 0, -170deg); 1925 | -webkit-animation-timing-function: ease-in; 1926 | animation-timing-function: ease-in; 1927 | } 1928 | 1929 | 80% { 1930 | -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) 1931 | rotate3d(0, 1, 0, 0deg); 1932 | transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) 1933 | rotate3d(0, 1, 0, 0deg); 1934 | -webkit-animation-timing-function: ease-in; 1935 | animation-timing-function: ease-in; 1936 | } 1937 | 1938 | to { 1939 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) 1940 | rotate3d(0, 1, 0, 0deg); 1941 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); 1942 | -webkit-animation-timing-function: ease-in; 1943 | animation-timing-function: ease-in; 1944 | } 1945 | } 1946 | 1947 | @keyframes flip { 1948 | from { 1949 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) 1950 | rotate3d(0, 1, 0, -360deg); 1951 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); 1952 | -webkit-animation-timing-function: ease-out; 1953 | animation-timing-function: ease-out; 1954 | } 1955 | 1956 | 40% { 1957 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1958 | rotate3d(0, 1, 0, -190deg); 1959 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1960 | rotate3d(0, 1, 0, -190deg); 1961 | -webkit-animation-timing-function: ease-out; 1962 | animation-timing-function: ease-out; 1963 | } 1964 | 1965 | 50% { 1966 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1967 | rotate3d(0, 1, 0, -170deg); 1968 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) 1969 | rotate3d(0, 1, 0, -170deg); 1970 | -webkit-animation-timing-function: ease-in; 1971 | animation-timing-function: ease-in; 1972 | } 1973 | 1974 | 80% { 1975 | -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) 1976 | rotate3d(0, 1, 0, 0deg); 1977 | transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) 1978 | rotate3d(0, 1, 0, 0deg); 1979 | -webkit-animation-timing-function: ease-in; 1980 | animation-timing-function: ease-in; 1981 | } 1982 | 1983 | to { 1984 | -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) 1985 | rotate3d(0, 1, 0, 0deg); 1986 | transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); 1987 | -webkit-animation-timing-function: ease-in; 1988 | animation-timing-function: ease-in; 1989 | } 1990 | } 1991 | 1992 | .animated.flip { 1993 | -webkit-backface-visibility: visible; 1994 | backface-visibility: visible; 1995 | -webkit-animation-name: flip; 1996 | animation-name: flip; 1997 | } 1998 | 1999 | @-webkit-keyframes flipInX { 2000 | from { 2001 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2002 | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2003 | -webkit-animation-timing-function: ease-in; 2004 | animation-timing-function: ease-in; 2005 | opacity: 0; 2006 | } 2007 | 2008 | 40% { 2009 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2010 | transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2011 | -webkit-animation-timing-function: ease-in; 2012 | animation-timing-function: ease-in; 2013 | } 2014 | 2015 | 60% { 2016 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); 2017 | transform: perspective(400px) rotate3d(1, 0, 0, 10deg); 2018 | opacity: 1; 2019 | } 2020 | 2021 | 80% { 2022 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); 2023 | transform: perspective(400px) rotate3d(1, 0, 0, -5deg); 2024 | } 2025 | 2026 | to { 2027 | -webkit-transform: perspective(400px); 2028 | transform: perspective(400px); 2029 | } 2030 | } 2031 | 2032 | @keyframes flipInX { 2033 | from { 2034 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2035 | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2036 | -webkit-animation-timing-function: ease-in; 2037 | animation-timing-function: ease-in; 2038 | opacity: 0; 2039 | } 2040 | 2041 | 40% { 2042 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2043 | transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2044 | -webkit-animation-timing-function: ease-in; 2045 | animation-timing-function: ease-in; 2046 | } 2047 | 2048 | 60% { 2049 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); 2050 | transform: perspective(400px) rotate3d(1, 0, 0, 10deg); 2051 | opacity: 1; 2052 | } 2053 | 2054 | 80% { 2055 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); 2056 | transform: perspective(400px) rotate3d(1, 0, 0, -5deg); 2057 | } 2058 | 2059 | to { 2060 | -webkit-transform: perspective(400px); 2061 | transform: perspective(400px); 2062 | } 2063 | } 2064 | 2065 | .flipInX { 2066 | -webkit-backface-visibility: visible !important; 2067 | backface-visibility: visible !important; 2068 | -webkit-animation-name: flipInX; 2069 | animation-name: flipInX; 2070 | } 2071 | 2072 | @-webkit-keyframes flipInY { 2073 | from { 2074 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2075 | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2076 | -webkit-animation-timing-function: ease-in; 2077 | animation-timing-function: ease-in; 2078 | opacity: 0; 2079 | } 2080 | 2081 | 40% { 2082 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); 2083 | transform: perspective(400px) rotate3d(0, 1, 0, -20deg); 2084 | -webkit-animation-timing-function: ease-in; 2085 | animation-timing-function: ease-in; 2086 | } 2087 | 2088 | 60% { 2089 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); 2090 | transform: perspective(400px) rotate3d(0, 1, 0, 10deg); 2091 | opacity: 1; 2092 | } 2093 | 2094 | 80% { 2095 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); 2096 | transform: perspective(400px) rotate3d(0, 1, 0, -5deg); 2097 | } 2098 | 2099 | to { 2100 | -webkit-transform: perspective(400px); 2101 | transform: perspective(400px); 2102 | } 2103 | } 2104 | 2105 | @keyframes flipInY { 2106 | from { 2107 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2108 | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2109 | -webkit-animation-timing-function: ease-in; 2110 | animation-timing-function: ease-in; 2111 | opacity: 0; 2112 | } 2113 | 2114 | 40% { 2115 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); 2116 | transform: perspective(400px) rotate3d(0, 1, 0, -20deg); 2117 | -webkit-animation-timing-function: ease-in; 2118 | animation-timing-function: ease-in; 2119 | } 2120 | 2121 | 60% { 2122 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); 2123 | transform: perspective(400px) rotate3d(0, 1, 0, 10deg); 2124 | opacity: 1; 2125 | } 2126 | 2127 | 80% { 2128 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); 2129 | transform: perspective(400px) rotate3d(0, 1, 0, -5deg); 2130 | } 2131 | 2132 | to { 2133 | -webkit-transform: perspective(400px); 2134 | transform: perspective(400px); 2135 | } 2136 | } 2137 | 2138 | .flipInY { 2139 | -webkit-backface-visibility: visible !important; 2140 | backface-visibility: visible !important; 2141 | -webkit-animation-name: flipInY; 2142 | animation-name: flipInY; 2143 | } 2144 | 2145 | @-webkit-keyframes flipOutX { 2146 | from { 2147 | -webkit-transform: perspective(400px); 2148 | transform: perspective(400px); 2149 | } 2150 | 2151 | 30% { 2152 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2153 | transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2154 | opacity: 1; 2155 | } 2156 | 2157 | to { 2158 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2159 | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2160 | opacity: 0; 2161 | } 2162 | } 2163 | 2164 | @keyframes flipOutX { 2165 | from { 2166 | -webkit-transform: perspective(400px); 2167 | transform: perspective(400px); 2168 | } 2169 | 2170 | 30% { 2171 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2172 | transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 2173 | opacity: 1; 2174 | } 2175 | 2176 | to { 2177 | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2178 | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 2179 | opacity: 0; 2180 | } 2181 | } 2182 | 2183 | .flipOutX { 2184 | -webkit-animation-duration: 0.75s; 2185 | animation-duration: 0.75s; 2186 | -webkit-animation-name: flipOutX; 2187 | animation-name: flipOutX; 2188 | -webkit-backface-visibility: visible !important; 2189 | backface-visibility: visible !important; 2190 | } 2191 | 2192 | @-webkit-keyframes flipOutY { 2193 | from { 2194 | -webkit-transform: perspective(400px); 2195 | transform: perspective(400px); 2196 | } 2197 | 2198 | 30% { 2199 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); 2200 | transform: perspective(400px) rotate3d(0, 1, 0, -15deg); 2201 | opacity: 1; 2202 | } 2203 | 2204 | to { 2205 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2206 | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2207 | opacity: 0; 2208 | } 2209 | } 2210 | 2211 | @keyframes flipOutY { 2212 | from { 2213 | -webkit-transform: perspective(400px); 2214 | transform: perspective(400px); 2215 | } 2216 | 2217 | 30% { 2218 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); 2219 | transform: perspective(400px) rotate3d(0, 1, 0, -15deg); 2220 | opacity: 1; 2221 | } 2222 | 2223 | to { 2224 | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2225 | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); 2226 | opacity: 0; 2227 | } 2228 | } 2229 | 2230 | .flipOutY { 2231 | -webkit-animation-duration: 0.75s; 2232 | animation-duration: 0.75s; 2233 | -webkit-backface-visibility: visible !important; 2234 | backface-visibility: visible !important; 2235 | -webkit-animation-name: flipOutY; 2236 | animation-name: flipOutY; 2237 | } 2238 | 2239 | @-webkit-keyframes lightSpeedIn { 2240 | from { 2241 | -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); 2242 | transform: translate3d(100%, 0, 0) skewX(-30deg); 2243 | opacity: 0; 2244 | } 2245 | 2246 | 60% { 2247 | -webkit-transform: skewX(20deg); 2248 | transform: skewX(20deg); 2249 | opacity: 1; 2250 | } 2251 | 2252 | 80% { 2253 | -webkit-transform: skewX(-5deg); 2254 | transform: skewX(-5deg); 2255 | } 2256 | 2257 | to { 2258 | -webkit-transform: translate3d(0, 0, 0); 2259 | transform: translate3d(0, 0, 0); 2260 | } 2261 | } 2262 | 2263 | @keyframes lightSpeedIn { 2264 | from { 2265 | -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); 2266 | transform: translate3d(100%, 0, 0) skewX(-30deg); 2267 | opacity: 0; 2268 | } 2269 | 2270 | 60% { 2271 | -webkit-transform: skewX(20deg); 2272 | transform: skewX(20deg); 2273 | opacity: 1; 2274 | } 2275 | 2276 | 80% { 2277 | -webkit-transform: skewX(-5deg); 2278 | transform: skewX(-5deg); 2279 | } 2280 | 2281 | to { 2282 | -webkit-transform: translate3d(0, 0, 0); 2283 | transform: translate3d(0, 0, 0); 2284 | } 2285 | } 2286 | 2287 | .lightSpeedIn { 2288 | -webkit-animation-name: lightSpeedIn; 2289 | animation-name: lightSpeedIn; 2290 | -webkit-animation-timing-function: ease-out; 2291 | animation-timing-function: ease-out; 2292 | } 2293 | 2294 | @-webkit-keyframes lightSpeedOut { 2295 | from { 2296 | opacity: 1; 2297 | } 2298 | 2299 | to { 2300 | -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); 2301 | transform: translate3d(100%, 0, 0) skewX(30deg); 2302 | opacity: 0; 2303 | } 2304 | } 2305 | 2306 | @keyframes lightSpeedOut { 2307 | from { 2308 | opacity: 1; 2309 | } 2310 | 2311 | to { 2312 | -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); 2313 | transform: translate3d(100%, 0, 0) skewX(30deg); 2314 | opacity: 0; 2315 | } 2316 | } 2317 | 2318 | .lightSpeedOut { 2319 | -webkit-animation-name: lightSpeedOut; 2320 | animation-name: lightSpeedOut; 2321 | -webkit-animation-timing-function: ease-in; 2322 | animation-timing-function: ease-in; 2323 | } 2324 | 2325 | @-webkit-keyframes rotateIn { 2326 | from { 2327 | -webkit-transform-origin: center; 2328 | transform-origin: center; 2329 | -webkit-transform: rotate3d(0, 0, 1, -200deg); 2330 | transform: rotate3d(0, 0, 1, -200deg); 2331 | opacity: 0; 2332 | } 2333 | 2334 | to { 2335 | -webkit-transform-origin: center; 2336 | transform-origin: center; 2337 | -webkit-transform: translate3d(0, 0, 0); 2338 | transform: translate3d(0, 0, 0); 2339 | opacity: 1; 2340 | } 2341 | } 2342 | 2343 | @keyframes rotateIn { 2344 | from { 2345 | -webkit-transform-origin: center; 2346 | transform-origin: center; 2347 | -webkit-transform: rotate3d(0, 0, 1, -200deg); 2348 | transform: rotate3d(0, 0, 1, -200deg); 2349 | opacity: 0; 2350 | } 2351 | 2352 | to { 2353 | -webkit-transform-origin: center; 2354 | transform-origin: center; 2355 | -webkit-transform: translate3d(0, 0, 0); 2356 | transform: translate3d(0, 0, 0); 2357 | opacity: 1; 2358 | } 2359 | } 2360 | 2361 | .rotateIn { 2362 | -webkit-animation-name: rotateIn; 2363 | animation-name: rotateIn; 2364 | } 2365 | 2366 | @-webkit-keyframes rotateInDownLeft { 2367 | from { 2368 | -webkit-transform-origin: left bottom; 2369 | transform-origin: left bottom; 2370 | -webkit-transform: rotate3d(0, 0, 1, -45deg); 2371 | transform: rotate3d(0, 0, 1, -45deg); 2372 | opacity: 0; 2373 | } 2374 | 2375 | to { 2376 | -webkit-transform-origin: left bottom; 2377 | transform-origin: left bottom; 2378 | -webkit-transform: translate3d(0, 0, 0); 2379 | transform: translate3d(0, 0, 0); 2380 | opacity: 1; 2381 | } 2382 | } 2383 | 2384 | @keyframes rotateInDownLeft { 2385 | from { 2386 | -webkit-transform-origin: left bottom; 2387 | transform-origin: left bottom; 2388 | -webkit-transform: rotate3d(0, 0, 1, -45deg); 2389 | transform: rotate3d(0, 0, 1, -45deg); 2390 | opacity: 0; 2391 | } 2392 | 2393 | to { 2394 | -webkit-transform-origin: left bottom; 2395 | transform-origin: left bottom; 2396 | -webkit-transform: translate3d(0, 0, 0); 2397 | transform: translate3d(0, 0, 0); 2398 | opacity: 1; 2399 | } 2400 | } 2401 | 2402 | .rotateInDownLeft { 2403 | -webkit-animation-name: rotateInDownLeft; 2404 | animation-name: rotateInDownLeft; 2405 | } 2406 | 2407 | @-webkit-keyframes rotateInDownRight { 2408 | from { 2409 | -webkit-transform-origin: right bottom; 2410 | transform-origin: right bottom; 2411 | -webkit-transform: rotate3d(0, 0, 1, 45deg); 2412 | transform: rotate3d(0, 0, 1, 45deg); 2413 | opacity: 0; 2414 | } 2415 | 2416 | to { 2417 | -webkit-transform-origin: right bottom; 2418 | transform-origin: right bottom; 2419 | -webkit-transform: translate3d(0, 0, 0); 2420 | transform: translate3d(0, 0, 0); 2421 | opacity: 1; 2422 | } 2423 | } 2424 | 2425 | @keyframes rotateInDownRight { 2426 | from { 2427 | -webkit-transform-origin: right bottom; 2428 | transform-origin: right bottom; 2429 | -webkit-transform: rotate3d(0, 0, 1, 45deg); 2430 | transform: rotate3d(0, 0, 1, 45deg); 2431 | opacity: 0; 2432 | } 2433 | 2434 | to { 2435 | -webkit-transform-origin: right bottom; 2436 | transform-origin: right bottom; 2437 | -webkit-transform: translate3d(0, 0, 0); 2438 | transform: translate3d(0, 0, 0); 2439 | opacity: 1; 2440 | } 2441 | } 2442 | 2443 | .rotateInDownRight { 2444 | -webkit-animation-name: rotateInDownRight; 2445 | animation-name: rotateInDownRight; 2446 | } 2447 | 2448 | @-webkit-keyframes rotateInUpLeft { 2449 | from { 2450 | -webkit-transform-origin: left bottom; 2451 | transform-origin: left bottom; 2452 | -webkit-transform: rotate3d(0, 0, 1, 45deg); 2453 | transform: rotate3d(0, 0, 1, 45deg); 2454 | opacity: 0; 2455 | } 2456 | 2457 | to { 2458 | -webkit-transform-origin: left bottom; 2459 | transform-origin: left bottom; 2460 | -webkit-transform: translate3d(0, 0, 0); 2461 | transform: translate3d(0, 0, 0); 2462 | opacity: 1; 2463 | } 2464 | } 2465 | 2466 | @keyframes rotateInUpLeft { 2467 | from { 2468 | -webkit-transform-origin: left bottom; 2469 | transform-origin: left bottom; 2470 | -webkit-transform: rotate3d(0, 0, 1, 45deg); 2471 | transform: rotate3d(0, 0, 1, 45deg); 2472 | opacity: 0; 2473 | } 2474 | 2475 | to { 2476 | -webkit-transform-origin: left bottom; 2477 | transform-origin: left bottom; 2478 | -webkit-transform: translate3d(0, 0, 0); 2479 | transform: translate3d(0, 0, 0); 2480 | opacity: 1; 2481 | } 2482 | } 2483 | 2484 | .rotateInUpLeft { 2485 | -webkit-animation-name: rotateInUpLeft; 2486 | animation-name: rotateInUpLeft; 2487 | } 2488 | 2489 | @-webkit-keyframes rotateInUpRight { 2490 | from { 2491 | -webkit-transform-origin: right bottom; 2492 | transform-origin: right bottom; 2493 | -webkit-transform: rotate3d(0, 0, 1, -90deg); 2494 | transform: rotate3d(0, 0, 1, -90deg); 2495 | opacity: 0; 2496 | } 2497 | 2498 | to { 2499 | -webkit-transform-origin: right bottom; 2500 | transform-origin: right bottom; 2501 | -webkit-transform: translate3d(0, 0, 0); 2502 | transform: translate3d(0, 0, 0); 2503 | opacity: 1; 2504 | } 2505 | } 2506 | 2507 | @keyframes rotateInUpRight { 2508 | from { 2509 | -webkit-transform-origin: right bottom; 2510 | transform-origin: right bottom; 2511 | -webkit-transform: rotate3d(0, 0, 1, -90deg); 2512 | transform: rotate3d(0, 0, 1, -90deg); 2513 | opacity: 0; 2514 | } 2515 | 2516 | to { 2517 | -webkit-transform-origin: right bottom; 2518 | transform-origin: right bottom; 2519 | -webkit-transform: translate3d(0, 0, 0); 2520 | transform: translate3d(0, 0, 0); 2521 | opacity: 1; 2522 | } 2523 | } 2524 | 2525 | .rotateInUpRight { 2526 | -webkit-animation-name: rotateInUpRight; 2527 | animation-name: rotateInUpRight; 2528 | } 2529 | 2530 | @-webkit-keyframes rotateOut { 2531 | from { 2532 | -webkit-transform-origin: center; 2533 | transform-origin: center; 2534 | opacity: 1; 2535 | } 2536 | 2537 | to { 2538 | -webkit-transform-origin: center; 2539 | transform-origin: center; 2540 | -webkit-transform: rotate3d(0, 0, 1, 200deg); 2541 | transform: rotate3d(0, 0, 1, 200deg); 2542 | opacity: 0; 2543 | } 2544 | } 2545 | 2546 | @keyframes rotateOut { 2547 | from { 2548 | -webkit-transform-origin: center; 2549 | transform-origin: center; 2550 | opacity: 1; 2551 | } 2552 | 2553 | to { 2554 | -webkit-transform-origin: center; 2555 | transform-origin: center; 2556 | -webkit-transform: rotate3d(0, 0, 1, 200deg); 2557 | transform: rotate3d(0, 0, 1, 200deg); 2558 | opacity: 0; 2559 | } 2560 | } 2561 | 2562 | .rotateOut { 2563 | -webkit-animation-name: rotateOut; 2564 | animation-name: rotateOut; 2565 | } 2566 | 2567 | @-webkit-keyframes rotateOutDownLeft { 2568 | from { 2569 | -webkit-transform-origin: left bottom; 2570 | transform-origin: left bottom; 2571 | opacity: 1; 2572 | } 2573 | 2574 | to { 2575 | -webkit-transform-origin: left bottom; 2576 | transform-origin: left bottom; 2577 | -webkit-transform: rotate3d(0, 0, 1, 45deg); 2578 | transform: rotate3d(0, 0, 1, 45deg); 2579 | opacity: 0; 2580 | } 2581 | } 2582 | 2583 | @keyframes rotateOutDownLeft { 2584 | from { 2585 | -webkit-transform-origin: left bottom; 2586 | transform-origin: left bottom; 2587 | opacity: 1; 2588 | } 2589 | 2590 | to { 2591 | -webkit-transform-origin: left bottom; 2592 | transform-origin: left bottom; 2593 | -webkit-transform: rotate3d(0, 0, 1, 45deg); 2594 | transform: rotate3d(0, 0, 1, 45deg); 2595 | opacity: 0; 2596 | } 2597 | } 2598 | 2599 | .rotateOutDownLeft { 2600 | -webkit-animation-name: rotateOutDownLeft; 2601 | animation-name: rotateOutDownLeft; 2602 | } 2603 | 2604 | @-webkit-keyframes rotateOutDownRight { 2605 | from { 2606 | -webkit-transform-origin: right bottom; 2607 | transform-origin: right bottom; 2608 | opacity: 1; 2609 | } 2610 | 2611 | to { 2612 | -webkit-transform-origin: right bottom; 2613 | transform-origin: right bottom; 2614 | -webkit-transform: rotate3d(0, 0, 1, -45deg); 2615 | transform: rotate3d(0, 0, 1, -45deg); 2616 | opacity: 0; 2617 | } 2618 | } 2619 | 2620 | @keyframes rotateOutDownRight { 2621 | from { 2622 | -webkit-transform-origin: right bottom; 2623 | transform-origin: right bottom; 2624 | opacity: 1; 2625 | } 2626 | 2627 | to { 2628 | -webkit-transform-origin: right bottom; 2629 | transform-origin: right bottom; 2630 | -webkit-transform: rotate3d(0, 0, 1, -45deg); 2631 | transform: rotate3d(0, 0, 1, -45deg); 2632 | opacity: 0; 2633 | } 2634 | } 2635 | 2636 | .rotateOutDownRight { 2637 | -webkit-animation-name: rotateOutDownRight; 2638 | animation-name: rotateOutDownRight; 2639 | } 2640 | 2641 | @-webkit-keyframes rotateOutUpLeft { 2642 | from { 2643 | -webkit-transform-origin: left bottom; 2644 | transform-origin: left bottom; 2645 | opacity: 1; 2646 | } 2647 | 2648 | to { 2649 | -webkit-transform-origin: left bottom; 2650 | transform-origin: left bottom; 2651 | -webkit-transform: rotate3d(0, 0, 1, -45deg); 2652 | transform: rotate3d(0, 0, 1, -45deg); 2653 | opacity: 0; 2654 | } 2655 | } 2656 | 2657 | @keyframes rotateOutUpLeft { 2658 | from { 2659 | -webkit-transform-origin: left bottom; 2660 | transform-origin: left bottom; 2661 | opacity: 1; 2662 | } 2663 | 2664 | to { 2665 | -webkit-transform-origin: left bottom; 2666 | transform-origin: left bottom; 2667 | -webkit-transform: rotate3d(0, 0, 1, -45deg); 2668 | transform: rotate3d(0, 0, 1, -45deg); 2669 | opacity: 0; 2670 | } 2671 | } 2672 | 2673 | .rotateOutUpLeft { 2674 | -webkit-animation-name: rotateOutUpLeft; 2675 | animation-name: rotateOutUpLeft; 2676 | } 2677 | 2678 | @-webkit-keyframes rotateOutUpRight { 2679 | from { 2680 | -webkit-transform-origin: right bottom; 2681 | transform-origin: right bottom; 2682 | opacity: 1; 2683 | } 2684 | 2685 | to { 2686 | -webkit-transform-origin: right bottom; 2687 | transform-origin: right bottom; 2688 | -webkit-transform: rotate3d(0, 0, 1, 90deg); 2689 | transform: rotate3d(0, 0, 1, 90deg); 2690 | opacity: 0; 2691 | } 2692 | } 2693 | 2694 | @keyframes rotateOutUpRight { 2695 | from { 2696 | -webkit-transform-origin: right bottom; 2697 | transform-origin: right bottom; 2698 | opacity: 1; 2699 | } 2700 | 2701 | to { 2702 | -webkit-transform-origin: right bottom; 2703 | transform-origin: right bottom; 2704 | -webkit-transform: rotate3d(0, 0, 1, 90deg); 2705 | transform: rotate3d(0, 0, 1, 90deg); 2706 | opacity: 0; 2707 | } 2708 | } 2709 | 2710 | .rotateOutUpRight { 2711 | -webkit-animation-name: rotateOutUpRight; 2712 | animation-name: rotateOutUpRight; 2713 | } 2714 | 2715 | @-webkit-keyframes hinge { 2716 | 0% { 2717 | -webkit-transform-origin: top left; 2718 | transform-origin: top left; 2719 | -webkit-animation-timing-function: ease-in-out; 2720 | animation-timing-function: ease-in-out; 2721 | } 2722 | 2723 | 20%, 2724 | 60% { 2725 | -webkit-transform: rotate3d(0, 0, 1, 80deg); 2726 | transform: rotate3d(0, 0, 1, 80deg); 2727 | -webkit-transform-origin: top left; 2728 | transform-origin: top left; 2729 | -webkit-animation-timing-function: ease-in-out; 2730 | animation-timing-function: ease-in-out; 2731 | } 2732 | 2733 | 40%, 2734 | 80% { 2735 | -webkit-transform: rotate3d(0, 0, 1, 60deg); 2736 | transform: rotate3d(0, 0, 1, 60deg); 2737 | -webkit-transform-origin: top left; 2738 | transform-origin: top left; 2739 | -webkit-animation-timing-function: ease-in-out; 2740 | animation-timing-function: ease-in-out; 2741 | opacity: 1; 2742 | } 2743 | 2744 | to { 2745 | -webkit-transform: translate3d(0, 700px, 0); 2746 | transform: translate3d(0, 700px, 0); 2747 | opacity: 0; 2748 | } 2749 | } 2750 | 2751 | @keyframes hinge { 2752 | 0% { 2753 | -webkit-transform-origin: top left; 2754 | transform-origin: top left; 2755 | -webkit-animation-timing-function: ease-in-out; 2756 | animation-timing-function: ease-in-out; 2757 | } 2758 | 2759 | 20%, 2760 | 60% { 2761 | -webkit-transform: rotate3d(0, 0, 1, 80deg); 2762 | transform: rotate3d(0, 0, 1, 80deg); 2763 | -webkit-transform-origin: top left; 2764 | transform-origin: top left; 2765 | -webkit-animation-timing-function: ease-in-out; 2766 | animation-timing-function: ease-in-out; 2767 | } 2768 | 2769 | 40%, 2770 | 80% { 2771 | -webkit-transform: rotate3d(0, 0, 1, 60deg); 2772 | transform: rotate3d(0, 0, 1, 60deg); 2773 | -webkit-transform-origin: top left; 2774 | transform-origin: top left; 2775 | -webkit-animation-timing-function: ease-in-out; 2776 | animation-timing-function: ease-in-out; 2777 | opacity: 1; 2778 | } 2779 | 2780 | to { 2781 | -webkit-transform: translate3d(0, 700px, 0); 2782 | transform: translate3d(0, 700px, 0); 2783 | opacity: 0; 2784 | } 2785 | } 2786 | 2787 | .hinge { 2788 | -webkit-animation-duration: 2s; 2789 | animation-duration: 2s; 2790 | -webkit-animation-name: hinge; 2791 | animation-name: hinge; 2792 | } 2793 | 2794 | @-webkit-keyframes jackInTheBox { 2795 | from { 2796 | opacity: 0; 2797 | -webkit-transform: scale(0.1) rotate(30deg); 2798 | transform: scale(0.1) rotate(30deg); 2799 | -webkit-transform-origin: center bottom; 2800 | transform-origin: center bottom; 2801 | } 2802 | 2803 | 50% { 2804 | -webkit-transform: rotate(-10deg); 2805 | transform: rotate(-10deg); 2806 | } 2807 | 2808 | 70% { 2809 | -webkit-transform: rotate(3deg); 2810 | transform: rotate(3deg); 2811 | } 2812 | 2813 | to { 2814 | opacity: 1; 2815 | -webkit-transform: scale(1); 2816 | transform: scale(1); 2817 | } 2818 | } 2819 | 2820 | @keyframes jackInTheBox { 2821 | from { 2822 | opacity: 0; 2823 | -webkit-transform: scale(0.1) rotate(30deg); 2824 | transform: scale(0.1) rotate(30deg); 2825 | -webkit-transform-origin: center bottom; 2826 | transform-origin: center bottom; 2827 | } 2828 | 2829 | 50% { 2830 | -webkit-transform: rotate(-10deg); 2831 | transform: rotate(-10deg); 2832 | } 2833 | 2834 | 70% { 2835 | -webkit-transform: rotate(3deg); 2836 | transform: rotate(3deg); 2837 | } 2838 | 2839 | to { 2840 | opacity: 1; 2841 | -webkit-transform: scale(1); 2842 | transform: scale(1); 2843 | } 2844 | } 2845 | 2846 | .jackInTheBox { 2847 | -webkit-animation-name: jackInTheBox; 2848 | animation-name: jackInTheBox; 2849 | } 2850 | 2851 | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ 2852 | 2853 | @-webkit-keyframes rollIn { 2854 | from { 2855 | opacity: 0; 2856 | -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); 2857 | transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); 2858 | } 2859 | 2860 | to { 2861 | opacity: 1; 2862 | -webkit-transform: translate3d(0, 0, 0); 2863 | transform: translate3d(0, 0, 0); 2864 | } 2865 | } 2866 | 2867 | @keyframes rollIn { 2868 | from { 2869 | opacity: 0; 2870 | -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); 2871 | transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); 2872 | } 2873 | 2874 | to { 2875 | opacity: 1; 2876 | -webkit-transform: translate3d(0, 0, 0); 2877 | transform: translate3d(0, 0, 0); 2878 | } 2879 | } 2880 | 2881 | .rollIn { 2882 | -webkit-animation-name: rollIn; 2883 | animation-name: rollIn; 2884 | } 2885 | 2886 | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ 2887 | 2888 | @-webkit-keyframes rollOut { 2889 | from { 2890 | opacity: 1; 2891 | } 2892 | 2893 | to { 2894 | opacity: 0; 2895 | -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); 2896 | transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); 2897 | } 2898 | } 2899 | 2900 | @keyframes rollOut { 2901 | from { 2902 | opacity: 1; 2903 | } 2904 | 2905 | to { 2906 | opacity: 0; 2907 | -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); 2908 | transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); 2909 | } 2910 | } 2911 | 2912 | .rollOut { 2913 | -webkit-animation-name: rollOut; 2914 | animation-name: rollOut; 2915 | } 2916 | 2917 | @-webkit-keyframes zoomIn { 2918 | from { 2919 | opacity: 0; 2920 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 2921 | transform: scale3d(0.3, 0.3, 0.3); 2922 | } 2923 | 2924 | 50% { 2925 | opacity: 1; 2926 | } 2927 | } 2928 | 2929 | @keyframes zoomIn { 2930 | from { 2931 | opacity: 0; 2932 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 2933 | transform: scale3d(0.3, 0.3, 0.3); 2934 | } 2935 | 2936 | 50% { 2937 | opacity: 1; 2938 | } 2939 | } 2940 | 2941 | .zoomIn { 2942 | -webkit-animation-name: zoomIn; 2943 | animation-name: zoomIn; 2944 | } 2945 | 2946 | @-webkit-keyframes zoomInDown { 2947 | from { 2948 | opacity: 0; 2949 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); 2950 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); 2951 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 2952 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 2953 | } 2954 | 2955 | 60% { 2956 | opacity: 1; 2957 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 2958 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 2959 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 2960 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 2961 | } 2962 | } 2963 | 2964 | @keyframes zoomInDown { 2965 | from { 2966 | opacity: 0; 2967 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); 2968 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); 2969 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 2970 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 2971 | } 2972 | 2973 | 60% { 2974 | opacity: 1; 2975 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 2976 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 2977 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 2978 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 2979 | } 2980 | } 2981 | 2982 | .zoomInDown { 2983 | -webkit-animation-name: zoomInDown; 2984 | animation-name: zoomInDown; 2985 | } 2986 | 2987 | @-webkit-keyframes zoomInLeft { 2988 | from { 2989 | opacity: 0; 2990 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); 2991 | transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); 2992 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 2993 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 2994 | } 2995 | 2996 | 60% { 2997 | opacity: 1; 2998 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); 2999 | transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); 3000 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3001 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3002 | } 3003 | } 3004 | 3005 | @keyframes zoomInLeft { 3006 | from { 3007 | opacity: 0; 3008 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); 3009 | transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); 3010 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3011 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3012 | } 3013 | 3014 | 60% { 3015 | opacity: 1; 3016 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); 3017 | transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); 3018 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3019 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3020 | } 3021 | } 3022 | 3023 | .zoomInLeft { 3024 | -webkit-animation-name: zoomInLeft; 3025 | animation-name: zoomInLeft; 3026 | } 3027 | 3028 | @-webkit-keyframes zoomInRight { 3029 | from { 3030 | opacity: 0; 3031 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); 3032 | transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); 3033 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3034 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3035 | } 3036 | 3037 | 60% { 3038 | opacity: 1; 3039 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); 3040 | transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); 3041 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3042 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3043 | } 3044 | } 3045 | 3046 | @keyframes zoomInRight { 3047 | from { 3048 | opacity: 0; 3049 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); 3050 | transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); 3051 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3052 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3053 | } 3054 | 3055 | 60% { 3056 | opacity: 1; 3057 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); 3058 | transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); 3059 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3060 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3061 | } 3062 | } 3063 | 3064 | .zoomInRight { 3065 | -webkit-animation-name: zoomInRight; 3066 | animation-name: zoomInRight; 3067 | } 3068 | 3069 | @-webkit-keyframes zoomInUp { 3070 | from { 3071 | opacity: 0; 3072 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); 3073 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); 3074 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3075 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3076 | } 3077 | 3078 | 60% { 3079 | opacity: 1; 3080 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3081 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3082 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3083 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3084 | } 3085 | } 3086 | 3087 | @keyframes zoomInUp { 3088 | from { 3089 | opacity: 0; 3090 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); 3091 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); 3092 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3093 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3094 | } 3095 | 3096 | 60% { 3097 | opacity: 1; 3098 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3099 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3100 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3101 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3102 | } 3103 | } 3104 | 3105 | .zoomInUp { 3106 | -webkit-animation-name: zoomInUp; 3107 | animation-name: zoomInUp; 3108 | } 3109 | 3110 | @-webkit-keyframes zoomOut { 3111 | from { 3112 | opacity: 1; 3113 | } 3114 | 3115 | 50% { 3116 | opacity: 0; 3117 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 3118 | transform: scale3d(0.3, 0.3, 0.3); 3119 | } 3120 | 3121 | to { 3122 | opacity: 0; 3123 | } 3124 | } 3125 | 3126 | @keyframes zoomOut { 3127 | from { 3128 | opacity: 1; 3129 | } 3130 | 3131 | 50% { 3132 | opacity: 0; 3133 | -webkit-transform: scale3d(0.3, 0.3, 0.3); 3134 | transform: scale3d(0.3, 0.3, 0.3); 3135 | } 3136 | 3137 | to { 3138 | opacity: 0; 3139 | } 3140 | } 3141 | 3142 | .zoomOut { 3143 | -webkit-animation-name: zoomOut; 3144 | animation-name: zoomOut; 3145 | } 3146 | 3147 | @-webkit-keyframes zoomOutDown { 3148 | 40% { 3149 | opacity: 1; 3150 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3151 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3152 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3153 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3154 | } 3155 | 3156 | to { 3157 | opacity: 0; 3158 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); 3159 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); 3160 | -webkit-transform-origin: center bottom; 3161 | transform-origin: center bottom; 3162 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3163 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3164 | } 3165 | } 3166 | 3167 | @keyframes zoomOutDown { 3168 | 40% { 3169 | opacity: 1; 3170 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3171 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); 3172 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3173 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3174 | } 3175 | 3176 | to { 3177 | opacity: 0; 3178 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); 3179 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); 3180 | -webkit-transform-origin: center bottom; 3181 | transform-origin: center bottom; 3182 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3183 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3184 | } 3185 | } 3186 | 3187 | .zoomOutDown { 3188 | -webkit-animation-name: zoomOutDown; 3189 | animation-name: zoomOutDown; 3190 | } 3191 | 3192 | @-webkit-keyframes zoomOutLeft { 3193 | 40% { 3194 | opacity: 1; 3195 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); 3196 | transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); 3197 | } 3198 | 3199 | to { 3200 | opacity: 0; 3201 | -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); 3202 | transform: scale(0.1) translate3d(-2000px, 0, 0); 3203 | -webkit-transform-origin: left center; 3204 | transform-origin: left center; 3205 | } 3206 | } 3207 | 3208 | @keyframes zoomOutLeft { 3209 | 40% { 3210 | opacity: 1; 3211 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); 3212 | transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); 3213 | } 3214 | 3215 | to { 3216 | opacity: 0; 3217 | -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); 3218 | transform: scale(0.1) translate3d(-2000px, 0, 0); 3219 | -webkit-transform-origin: left center; 3220 | transform-origin: left center; 3221 | } 3222 | } 3223 | 3224 | .zoomOutLeft { 3225 | -webkit-animation-name: zoomOutLeft; 3226 | animation-name: zoomOutLeft; 3227 | } 3228 | 3229 | @-webkit-keyframes zoomOutRight { 3230 | 40% { 3231 | opacity: 1; 3232 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); 3233 | transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); 3234 | } 3235 | 3236 | to { 3237 | opacity: 0; 3238 | -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); 3239 | transform: scale(0.1) translate3d(2000px, 0, 0); 3240 | -webkit-transform-origin: right center; 3241 | transform-origin: right center; 3242 | } 3243 | } 3244 | 3245 | @keyframes zoomOutRight { 3246 | 40% { 3247 | opacity: 1; 3248 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); 3249 | transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); 3250 | } 3251 | 3252 | to { 3253 | opacity: 0; 3254 | -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); 3255 | transform: scale(0.1) translate3d(2000px, 0, 0); 3256 | -webkit-transform-origin: right center; 3257 | transform-origin: right center; 3258 | } 3259 | } 3260 | 3261 | .zoomOutRight { 3262 | -webkit-animation-name: zoomOutRight; 3263 | animation-name: zoomOutRight; 3264 | } 3265 | 3266 | @-webkit-keyframes zoomOutUp { 3267 | 40% { 3268 | opacity: 1; 3269 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 3270 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 3271 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3272 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3273 | } 3274 | 3275 | to { 3276 | opacity: 0; 3277 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); 3278 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); 3279 | -webkit-transform-origin: center bottom; 3280 | transform-origin: center bottom; 3281 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3282 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3283 | } 3284 | } 3285 | 3286 | @keyframes zoomOutUp { 3287 | 40% { 3288 | opacity: 1; 3289 | -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 3290 | transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); 3291 | -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3292 | animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 3293 | } 3294 | 3295 | to { 3296 | opacity: 0; 3297 | -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); 3298 | transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); 3299 | -webkit-transform-origin: center bottom; 3300 | transform-origin: center bottom; 3301 | -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3302 | animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); 3303 | } 3304 | } 3305 | 3306 | .zoomOutUp { 3307 | -webkit-animation-name: zoomOutUp; 3308 | animation-name: zoomOutUp; 3309 | } 3310 | 3311 | @-webkit-keyframes slideInDown { 3312 | from { 3313 | -webkit-transform: translate3d(0, -100%, 0); 3314 | transform: translate3d(0, -100%, 0); 3315 | visibility: visible; 3316 | } 3317 | 3318 | to { 3319 | -webkit-transform: translate3d(0, 0, 0); 3320 | transform: translate3d(0, 0, 0); 3321 | } 3322 | } 3323 | 3324 | @keyframes slideInDown { 3325 | from { 3326 | -webkit-transform: translate3d(0, -100%, 0); 3327 | transform: translate3d(0, -100%, 0); 3328 | visibility: visible; 3329 | } 3330 | 3331 | to { 3332 | -webkit-transform: translate3d(0, 0, 0); 3333 | transform: translate3d(0, 0, 0); 3334 | } 3335 | } 3336 | 3337 | .slideInDown { 3338 | -webkit-animation-name: slideInDown; 3339 | animation-name: slideInDown; 3340 | } 3341 | 3342 | @-webkit-keyframes slideInLeft { 3343 | from { 3344 | -webkit-transform: translate3d(-100%, 0, 0); 3345 | transform: translate3d(-100%, 0, 0); 3346 | visibility: visible; 3347 | } 3348 | 3349 | to { 3350 | -webkit-transform: translate3d(0, 0, 0); 3351 | transform: translate3d(0, 0, 0); 3352 | } 3353 | } 3354 | 3355 | @keyframes slideInLeft { 3356 | from { 3357 | -webkit-transform: translate3d(-100%, 0, 0); 3358 | transform: translate3d(-100%, 0, 0); 3359 | visibility: visible; 3360 | } 3361 | 3362 | to { 3363 | -webkit-transform: translate3d(0, 0, 0); 3364 | transform: translate3d(0, 0, 0); 3365 | } 3366 | } 3367 | 3368 | .slideInLeft { 3369 | -webkit-animation-name: slideInLeft; 3370 | animation-name: slideInLeft; 3371 | } 3372 | 3373 | @-webkit-keyframes slideInRight { 3374 | from { 3375 | -webkit-transform: translate3d(100%, 0, 0); 3376 | transform: translate3d(100%, 0, 0); 3377 | visibility: visible; 3378 | } 3379 | 3380 | to { 3381 | -webkit-transform: translate3d(0, 0, 0); 3382 | transform: translate3d(0, 0, 0); 3383 | } 3384 | } 3385 | 3386 | @keyframes slideInRight { 3387 | from { 3388 | -webkit-transform: translate3d(100%, 0, 0); 3389 | transform: translate3d(100%, 0, 0); 3390 | visibility: visible; 3391 | } 3392 | 3393 | to { 3394 | -webkit-transform: translate3d(0, 0, 0); 3395 | transform: translate3d(0, 0, 0); 3396 | } 3397 | } 3398 | 3399 | .slideInRight { 3400 | -webkit-animation-name: slideInRight; 3401 | animation-name: slideInRight; 3402 | } 3403 | 3404 | @-webkit-keyframes slideInUp { 3405 | from { 3406 | -webkit-transform: translate3d(0, 100%, 0); 3407 | transform: translate3d(0, 100%, 0); 3408 | visibility: visible; 3409 | } 3410 | 3411 | to { 3412 | -webkit-transform: translate3d(0, 0, 0); 3413 | transform: translate3d(0, 0, 0); 3414 | } 3415 | } 3416 | 3417 | @keyframes slideInUp { 3418 | from { 3419 | -webkit-transform: translate3d(0, 100%, 0); 3420 | transform: translate3d(0, 100%, 0); 3421 | visibility: visible; 3422 | } 3423 | 3424 | to { 3425 | -webkit-transform: translate3d(0, 0, 0); 3426 | transform: translate3d(0, 0, 0); 3427 | } 3428 | } 3429 | 3430 | .slideInUp { 3431 | -webkit-animation-name: slideInUp; 3432 | animation-name: slideInUp; 3433 | } 3434 | 3435 | @-webkit-keyframes slideOutDown { 3436 | from { 3437 | -webkit-transform: translate3d(0, 0, 0); 3438 | transform: translate3d(0, 0, 0); 3439 | } 3440 | 3441 | to { 3442 | visibility: hidden; 3443 | -webkit-transform: translate3d(0, 100%, 0); 3444 | transform: translate3d(0, 100%, 0); 3445 | } 3446 | } 3447 | 3448 | @keyframes slideOutDown { 3449 | from { 3450 | -webkit-transform: translate3d(0, 0, 0); 3451 | transform: translate3d(0, 0, 0); 3452 | } 3453 | 3454 | to { 3455 | visibility: hidden; 3456 | -webkit-transform: translate3d(0, 100%, 0); 3457 | transform: translate3d(0, 100%, 0); 3458 | } 3459 | } 3460 | 3461 | .slideOutDown { 3462 | -webkit-animation-name: slideOutDown; 3463 | animation-name: slideOutDown; 3464 | } 3465 | 3466 | @-webkit-keyframes slideOutLeft { 3467 | from { 3468 | -webkit-transform: translate3d(0, 0, 0); 3469 | transform: translate3d(0, 0, 0); 3470 | } 3471 | 3472 | to { 3473 | visibility: hidden; 3474 | -webkit-transform: translate3d(-100%, 0, 0); 3475 | transform: translate3d(-100%, 0, 0); 3476 | } 3477 | } 3478 | 3479 | @keyframes slideOutLeft { 3480 | from { 3481 | -webkit-transform: translate3d(0, 0, 0); 3482 | transform: translate3d(0, 0, 0); 3483 | } 3484 | 3485 | to { 3486 | visibility: hidden; 3487 | -webkit-transform: translate3d(-100%, 0, 0); 3488 | transform: translate3d(-100%, 0, 0); 3489 | } 3490 | } 3491 | 3492 | .slideOutLeft { 3493 | -webkit-animation-name: slideOutLeft; 3494 | animation-name: slideOutLeft; 3495 | } 3496 | 3497 | @-webkit-keyframes slideOutRight { 3498 | from { 3499 | -webkit-transform: translate3d(0, 0, 0); 3500 | transform: translate3d(0, 0, 0); 3501 | } 3502 | 3503 | to { 3504 | visibility: hidden; 3505 | -webkit-transform: translate3d(100%, 0, 0); 3506 | transform: translate3d(100%, 0, 0); 3507 | } 3508 | } 3509 | 3510 | @keyframes slideOutRight { 3511 | from { 3512 | -webkit-transform: translate3d(0, 0, 0); 3513 | transform: translate3d(0, 0, 0); 3514 | } 3515 | 3516 | to { 3517 | visibility: hidden; 3518 | -webkit-transform: translate3d(100%, 0, 0); 3519 | transform: translate3d(100%, 0, 0); 3520 | } 3521 | } 3522 | 3523 | .slideOutRight { 3524 | -webkit-animation-name: slideOutRight; 3525 | animation-name: slideOutRight; 3526 | } 3527 | 3528 | @-webkit-keyframes slideOutUp { 3529 | from { 3530 | -webkit-transform: translate3d(0, 0, 0); 3531 | transform: translate3d(0, 0, 0); 3532 | } 3533 | 3534 | to { 3535 | visibility: hidden; 3536 | -webkit-transform: translate3d(0, -100%, 0); 3537 | transform: translate3d(0, -100%, 0); 3538 | } 3539 | } 3540 | 3541 | @keyframes slideOutUp { 3542 | from { 3543 | -webkit-transform: translate3d(0, 0, 0); 3544 | transform: translate3d(0, 0, 0); 3545 | } 3546 | 3547 | to { 3548 | visibility: hidden; 3549 | -webkit-transform: translate3d(0, -100%, 0); 3550 | transform: translate3d(0, -100%, 0); 3551 | } 3552 | } 3553 | 3554 | .slideOutUp { 3555 | -webkit-animation-name: slideOutUp; 3556 | animation-name: slideOutUp; 3557 | } 3558 | 3559 | .animated { 3560 | -webkit-animation-duration: 300ms; 3561 | animation-duration: 300ms; 3562 | -webkit-animation-fill-mode: both; 3563 | animation-fill-mode: both; 3564 | } 3565 | 3566 | .animated.infinite { 3567 | -webkit-animation-iteration-count: infinite; 3568 | animation-iteration-count: infinite; 3569 | } 3570 | 3571 | .animated.delay-1s { 3572 | -webkit-animation-delay: 1s; 3573 | animation-delay: 1s; 3574 | } 3575 | 3576 | .animated.delay-2s { 3577 | -webkit-animation-delay: 2s; 3578 | animation-delay: 2s; 3579 | } 3580 | 3581 | .animated.delay-3s { 3582 | -webkit-animation-delay: 3s; 3583 | animation-delay: 3s; 3584 | } 3585 | 3586 | .animated.delay-4s { 3587 | -webkit-animation-delay: 4s; 3588 | animation-delay: 4s; 3589 | } 3590 | 3591 | .animated.delay-5s { 3592 | -webkit-animation-delay: 5s; 3593 | animation-delay: 5s; 3594 | } 3595 | 3596 | .animated.fast { 3597 | -webkit-animation-duration: 800ms; 3598 | animation-duration: 800ms; 3599 | } 3600 | 3601 | .animated.faster { 3602 | -webkit-animation-duration: 500ms; 3603 | animation-duration: 500ms; 3604 | } 3605 | 3606 | .animated.slow { 3607 | -webkit-animation-duration: 2s; 3608 | animation-duration: 2s; 3609 | } 3610 | 3611 | .animated.slower { 3612 | -webkit-animation-duration: 3s; 3613 | animation-duration: 3s; 3614 | } 3615 | 3616 | @media (print), (prefers-reduced-motion: reduce) { 3617 | .animated { 3618 | -webkit-animation-duration: 1ms !important; 3619 | animation-duration: 1ms !important; 3620 | -webkit-transition-duration: 1ms !important; 3621 | transition-duration: 1ms !important; 3622 | -webkit-animation-iteration-count: 1 !important; 3623 | animation-iteration-count: 1 !important; 3624 | } 3625 | } 3626 | -------------------------------------------------------------------------------- /src/assets/styles/border.styl: -------------------------------------------------------------------------------- 1 | border1px($border-width = 1px, $border-color = #ccc, $border-style = solid, $radius = 0) 2 | position relative 3 | border-radius $radius 4 | &::after 5 | // 用以解决边框layer遮盖内容 6 | pointer-events none 7 | position absolute 8 | z-index 999 9 | top 0 10 | left 0 11 | // fix当元素宽度出现小数时，边框可能显示不全的问题 12 | // overflow: hidden; 13 | content "\0020" 14 | border-color $border-color 15 | border-style $border-style 16 | border-width $border-width 17 | @media screen and (max--moz-device-pixel-ratio: 1.49), 18 | (-webkit-max-device-pixel-ratio: 1.49), 19 | (max-device-pixel-ratio: 1.49), 20 | (max-resolution: 143dpi), 21 | (max-resolution: 1.49dppx) 22 | width 100% 23 | height 100% 24 | if $radius > 0 25 | border-radius $radius 26 | @media screen and (min--moz-device-pixel-ratio: 1.5) and (max--moz-device-pixel-ratio: 2.49), 27 | (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 2.49), 28 | (min-device-pixel-ratio: 1.5) and (max-device-pixel-ratio: 2.49), 29 | (min-resolution: 144dpi) and (max-resolution: 239dpi), 30 | (min-resolution: 1.5dppx) and (max-resolution: 2.49dppx) 31 | width 200% 32 | height 200% 33 | transform scale(.5) 34 | if $radius > 0 35 | border-radius $radius * 2 36 | @media screen and (min--moz-device-pixel-ratio: 2.5), 37 | (-webkit-min-device-pixel-ratio: 2.5), 38 | (min-device-pixel-ratio: 2.5), 39 | (min-resolution: 240dpi), 40 | (min-resolution: 2.5dppx) 41 | width 300% 42 | height 300% 43 | transform scale(.3333333) 44 | if $radius > 0 45 | border-radius $radius * 3 46 | transform-origin 0 0 -------------------------------------------------------------------------------- /src/assets/styles/reset.css: -------------------------------------------------------------------------------- 1 | *, 2 | ::before, 3 | ::after { 4 | -webkit-box-sizing: border-box; 5 | box-sizing: border-box; 6 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } 7 | 8 | html, 9 | body { 10 | overflow: hidden; 11 | height: 100%; } 12 | 13 | ::-webkit-scrollbar { 14 | display: none; } 15 | 16 | html { 17 | background-color: #eee; 18 | color: #212121; 19 | font-size: 100px; 20 | -webkit-user-select: none; 21 | user-select: none; } 22 | 23 | body { 24 | margin: 0; 25 | font-size: 0.14em; 26 | line-height: 1.5; 27 | font-family: PingFangSC-Regular, Hiragino Sans GB, sans-serif } 28 | 29 | ul, 30 | ol, 31 | dl, 32 | dd, 33 | h1, 34 | h2, 35 | h3, 36 | h4, 37 | h5, 38 | h6, 39 | figure, 40 | form, 41 | fieldset, 42 | legend, 43 | input, 44 | textarea, 45 | button, 46 | p, 47 | blockquote, 48 | th, 49 | td, 50 | pre, 51 | xmp { 52 | margin: 0; 53 | padding: 0; } 54 | 55 | input, 56 | textarea, 57 | button, 58 | select, 59 | pre, 60 | xmp, 61 | tt, 62 | code, 63 | kbd, 64 | samp { 65 | line-height: inherit; 66 | font-family: inherit; } 67 | 68 | h1, 69 | h2, 70 | h3, 71 | h4, 72 | h5, 73 | h6, 74 | small, 75 | big, 76 | input, 77 | textarea, 78 | button, 79 | select { 80 | font-size: inherit; } 81 | 82 | address, 83 | cite, 84 | dfn, 85 | em, 86 | i, 87 | optgroup, 88 | var { 89 | font-style: normal; } 90 | 91 | table { 92 | border-collapse: collapse; 93 | border-spacing: 0; 94 | table-layout: fixed; 95 | text-align: left; } 96 | 97 | ul, 98 | ol, 99 | menu { 100 | list-style: none; } 101 | 102 | fieldset, 103 | img { 104 | border: 0; 105 | vertical-align: middle; } 106 | 107 | article, 108 | aside, 109 | details, 110 | figcaption, 111 | figure, 112 | footer, 113 | header, 114 | main, 115 | menu, 116 | nav, 117 | section, 118 | summary { 119 | display: block; } 120 | 121 | audio, 122 | canvas, 123 | video { 124 | display: inline-block; } 125 | 126 | blockquote:before, 127 | blockquote:after, 128 | q:before, 129 | q:after { 130 | content: "\0020"; } 131 | 132 | textarea, 133 | pre, 134 | xmp { 135 | overflow: auto; 136 | -webkit-overflow-scrolling: touch; } 137 | 138 | textarea { 139 | resize: vertical; } 140 | 141 | input, 142 | textarea, 143 | button, 144 | select, 145 | summary, 146 | a { 147 | outline: 0 none; } 148 | 149 | input, 150 | textarea, 151 | button, 152 | select { 153 | color: inherit; } 154 | input:disabled, 155 | textarea:disabled, 156 | button:disabled, 157 | select:disabled { 158 | opacity: 1; } 159 | 160 | button::-moz-focus-inner, 161 | input::-moz-focus-inner { 162 | padding: 0; 163 | border: 0; } 164 | 165 | input[type="button"], 166 | input[type="submit"], 167 | input[type="reset"], 168 | input[type="file"]::-webkit-file-upload-button, 169 | input[type="search"]::-webkit-search-cancel-button { 170 | -webkit-appearance: none; 171 | appearance: none; } 172 | 173 | ::-webkit-details-marker { 174 | display: none; } 175 | 176 | mark { 177 | background-color: rgba(0, 0, 0, 0); } 178 | 179 | a, 180 | ins, 181 | s, 182 | u, 183 | del { 184 | text-decoration: none; } 185 | 186 | a, 187 | img { 188 | -webkit-touch-callout: none; } 189 | 190 | a { 191 | color: #00afc7; } 192 | 193 | .g-clear::after, 194 | .g-mod::after { 195 | display: block; 196 | overflow: hidden; 197 | clear: both; 198 | height: 0; 199 | content: "\0020"; } 200 | 201 | @font-face { 202 | font-family: yofont; 203 | src: url(//ss.qunarzz.com/yo/font/1.0.3/yofont.woff) format("woff"), url(//ss.qunarzz.com/yo/font/1.0.3/yofont.ttf) format("truetype"); } 204 | 205 | .yo-ico { 206 | font-family: yofont !important; 207 | font-style: normal; 208 | -webkit-font-smoothing: antialiased; 209 | -moz-osx-font-smoothing: grayscale; 210 | vertical-align: middle; } -------------------------------------------------------------------------------- /src/assets/swiper.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lurongtao/gp12-vue.js-maoyan/8b337c44859ce506ef807eaaa2ad78186bace255/src/assets/swiper.png -------------------------------------------------------------------------------- /src/components/movie_list/MovieButton.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 36 | 37 | -------------------------------------------------------------------------------- /src/components/movie_list/MovieItem.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | -------------------------------------------------------------------------------- /src/components/movie_list/MovieList.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 40 | 41 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | import router from './router' 5 | import store from './store/store' 6 | 7 | Vue.config.productionTip = false 8 | 9 | new Vue({ 10 | store, 11 | router, 12 | el: '#app', 13 | render: h => h(App) 14 | }) 15 | -------------------------------------------------------------------------------- /src/mixins/movie.js: -------------------------------------------------------------------------------- 1 | const movieMixin = { 2 | beforeCreate() { 3 | let from = this.$route.name === 'intheater' ? 'intheaters' : 'comingsoon' 4 | this.page = this.$store.state[from].page 5 | this.movieIds = [] 6 | this.chunkedMovieIds = [] 7 | this.limit = 10 8 | }, 9 | 10 | computed: { 11 | city() { 12 | return this.$store.state.city.id 13 | } 14 | }, 15 | 16 | methods: { 17 | async handleMessage(bScroll) { 18 | if (this.chunkedMovieIds[this.page]) { 19 | 20 | await this.$store.dispatch('loadMoreData', { 21 | limit: this.limit, 22 | movieIds: this.chunkedMovieIds[this.page].join(','), 23 | page: this.page + 1, 24 | from: this.$route.name 25 | }) 26 | 27 | let from 28 | let type 29 | if (this.$route.name === 'intheater') { 30 | from = 'intheaters' 31 | type = 'movieList' 32 | } else { 33 | from = 'comingsoon' 34 | type = 'coming' 35 | } 36 | 37 | let result = this.$store.state[from].data 38 | 39 | this.movieList = result[type] 40 | 41 | this.$nextTick(() => { 42 | bScroll.refresh() 43 | bScroll.finishPullUp() 44 | this.page++ 45 | }) 46 | } 47 | }, 48 | 49 | handleReceiveScroll(bScroll) { 50 | this.bScroll = bScroll 51 | } 52 | }, 53 | } 54 | 55 | export default movieMixin -------------------------------------------------------------------------------- /src/mock/city.json: -------------------------------------------------------------------------------- 1 | {"cts":[{"id":1,"nm":"北京","py":"beijing"},{"id":10,"nm":"上海","py":"shanghai"},{"id":20,"nm":"广州","py":"guangzhou"},{"id":30,"nm":"深圳","py":"shenzhen"},{"id":42,"nm":"西安","py":"xian"},{"id":40,"nm":"天津","py":"tianjin"},{"id":44,"nm":"福州","py":"fuzhou"},{"id":45,"nm":"重庆","py":"chongqing"},{"id":51,"nm":"宁波","py":"ningbo"},{"id":50,"nm":"杭州","py":"hangzhou"},{"id":55,"nm":"南京","py":"nanjing"},{"id":52,"nm":"无锡","py":"wuxi"},{"id":59,"nm":"成都","py":"chengdu"},{"id":57,"nm":"武汉","py":"wuhan"},{"id":56,"nm":"合肥","py":"hefei"},{"id":62,"nm":"厦门","py":"xiamen"},{"id":60,"nm":"青岛","py":"qingdao"},{"id":70,"nm":"长沙","py":"changsha"},{"id":65,"nm":"大连","py":"dalian"},{"id":66,"nm":"沈阳","py":"shenyang"},{"id":76,"nm":"石家庄","py":"shijiazhuang"},{"id":73,"nm":"郑州","py":"zhengzhou"},{"id":84,"nm":"保定","py":"baoding"},{"id":81,"nm":"淄博","py":"zibo"},{"id":80,"nm":"苏州","py":"suzhou"},{"id":83,"nm":"南昌","py":"nanchang"},{"id":82,"nm":"南通","py":"nantong"},{"id":93,"nm":"桂林","py":"guilin"},{"id":92,"nm":"佛山","py":"foshan"},{"id":95,"nm":"葫芦岛","py":"huludao"},{"id":94,"nm":"海口","py":"haikou"},{"id":89,"nm":"常州","py":"changzhou"},{"id":88,"nm":"蚌埠","py":"bengbu"},{"id":91,"nm":"东莞","py":"dongguan"},{"id":90,"nm":"大庆","py":"daqing"},{"id":102,"nm":"芜湖","py":"wuhu"},{"id":103,"nm":"新乡","py":"xinxiang"},{"id":101,"nm":"太原","py":"taiyuan"},{"id":98,"nm":"锦州","py":"jinzhou"},{"id":99,"nm":"南宁","py":"nanning"},{"id":96,"nm":"济南","py":"jinan"},{"id":97,"nm":"焦作","py":"jiaozuo"},{"id":110,"nm":"泉州","py":"quanzhou"},{"id":111,"nm":"三亚","py":"sanya"},{"id":108,"nm":"珠海","py":"zhuhai"},{"id":109,"nm":"齐齐哈尔","py":"qiqihaer"},{"id":106,"nm":"廊坊","py":"langfang"},{"id":107,"nm":"贵阳","py":"guiyang"},{"id":104,"nm":"烟台","py":"yantai"},{"id":105,"nm":"哈尔滨","py":"haerbin"},{"id":119,"nm":"徐州","py":"xuzhou"},{"id":117,"nm":"汕头","py":"shantou"},{"id":116,"nm":"长春","py":"changchun"},{"id":115,"nm":"九江","py":"jiujiang"},{"id":114,"nm":"昆明","py":"kunming"},{"id":113,"nm":"中山","py":"zhongshan"},{"id":112,"nm":"温州","py":"wenzhou"},{"id":127,"nm":"沧州","py":"cangzhou"},{"id":126,"nm":"承德","py":"chengde"},{"id":125,"nm":"张家口","py":"zhangjiakou"},{"id":124,"nm":"邢台","py":"xingtai"},{"id":123,"nm":"邯郸","py":"handan"},{"id":122,"nm":"秦皇岛","py":"qinhuangdao"},{"id":121,"nm":"唐山","py":"tangshan"},{"id":120,"nm":"扬州","py":"yangzhou"},{"id":137,"nm":"临汾","py":"linfen"},{"id":136,"nm":"忻州","py":"xinzhou"},{"id":139,"nm":"呼和浩特","py":"huhehaote"},{"id":138,"nm":"吕梁","py":"lvliang"},{"id":141,"nm":"乌海","py":"wuhai"},{"id":140,"nm":"包头","py":"baotou"},{"id":143,"nm":"通辽","py":"tongliao"},{"id":142,"nm":"赤峰","py":"chifeng"},{"id":129,"nm":"大同","py":"datong"},{"id":128,"nm":"衡水","py":"hengshui"},{"id":131,"nm":"长治","py":"changzhi"},{"id":130,"nm":"阳泉","py":"yangquan"},{"id":133,"nm":"朔州","py":"shuozhou"},{"id":132,"nm":"晋城","py":"jincheng"},{"id":135,"nm":"运城","py":"yuncheng"},{"id":134,"nm":"晋中","py":"jinzhong"},{"id":152,"nm":"抚顺","py":"fushun"},{"id":153,"nm":"本溪","py":"benxi"},{"id":154,"nm":"丹东","py":"dandong"},{"id":155,"nm":"营口","py":"yingkou"},{"id":156,"nm":"阜新","py":"fuxin"},{"id":157,"nm":"辽阳","py":"liaoyang"},{"id":158,"nm":"盘锦","py":"panjin"},{"id":159,"nm":"铁岭","py":"tieling"},{"id":144,"nm":"鄂尔多斯","py":"eerduosi"},{"id":145,"nm":"呼伦贝尔","py":"hulunbeier"},{"id":146,"nm":"巴彦淖尔","py":"bayannaoer"},{"id":147,"nm":"乌兰察布","py":"wulanchabu"},{"id":148,"nm":"兴安盟","py":"xinganmeng"},{"id":149,"nm":"锡林郭勒","py":"xilinguolemeng"},{"id":150,"nm":"阿拉善盟","py":"alashanmeng"},{"id":151,"nm":"鞍山","py":"anshan"},{"id":171,"nm":"双鸭山","py":"shuangyashan"},{"id":170,"nm":"鹤岗","py":"hegang"},{"id":169,"nm":"鸡西","py":"jixi"},{"id":168,"nm":"延边","py":"yanbian"},{"id":175,"nm":"牡丹江","py":"mudanjiang"},{"id":174,"nm":"七台河","py":"qitaihe"},{"id":173,"nm":"佳木斯","py":"jiamusi"},{"id":172,"nm":"伊春","py":"yichunyc"},{"id":163,"nm":"辽源","py":"liaoyuan"},{"id":162,"nm":"四平","py":"siping"},{"id":161,"nm":"吉林","py":"jilin"},{"id":160,"nm":"朝阳","py":"chaoyang"},{"id":167,"nm":"白城","py":"baicheng"},{"id":166,"nm":"松原","py":"songyuan"},{"id":165,"nm":"白山","py":"baishan"},{"id":164,"nm":"通化","py":"tonghua"},{"id":186,"nm":"湖州","py":"huzhou"},{"id":187,"nm":"绍兴","py":"shaoxing"},{"id":184,"nm":"宿迁","py":"suqian"},{"id":185,"nm":"嘉兴","py":"jiaxing"},{"id":190,"nm":"舟山","py":"zhoushan"},{"id":191,"nm":"台州","py":"taizhoutz"},{"id":188,"nm":"金华","py":"jinhua"},{"id":189,"nm":"衢州","py":"quzhou"},{"id":178,"nm":"大兴安岭","py":"daxinganling"},{"id":179,"nm":"连云港","py":"lianyungang"},{"id":176,"nm":"黑河","py":"heihe"},{"id":177,"nm":"绥化","py":"suihua"},{"id":182,"nm":"镇江","py":"zhenjiang"},{"id":183,"nm":"泰州","py":"taizhou"},{"id":180,"nm":"淮安","py":"huaian"},{"id":181,"nm":"盐城","py":"yancheng"},{"id":205,"nm":"池州","py":"chizhou"},{"id":204,"nm":"亳州","py":"bozhou"},{"id":207,"nm":"莆田","py":"putian"},{"id":206,"nm":"宣城","py":"xuancheng"},{"id":201,"nm":"宿州","py":"suzhousz"},{"id":200,"nm":"阜阳","py":"fuyang"},{"id":203,"nm":"六安","py":"liuan"},{"id":202,"nm":"巢湖","py":"chaohu"},{"id":197,"nm":"安庆","py":"anqing"},{"id":196,"nm":"铜陵","py":"tongling"},{"id":199,"nm":"滁州","py":"chuzhou"},{"id":198,"nm":"黄山","py":"huangshan"},{"id":193,"nm":"淮南","py":"huainan"},{"id":192,"nm":"丽水","py":"lishui"},{"id":195,"nm":"淮北","py":"huaibei"},{"id":194,"nm":"马鞍山","py":"maanshan"},{"id":220,"nm":"抚州","py":"fuzhoufz"},{"id":221,"nm":"上饶","py":"shangrao"},{"id":222,"nm":"枣庄","py":"zaozhuang"},{"id":223,"nm":"东营","py":"dongying"},{"id":216,"nm":"鹰潭","py":"yingtan"},{"id":217,"nm":"赣州","py":"ganzhou"},{"id":218,"nm":"吉安","py":"jian"},{"id":219,"nm":"宜春","py":"yichun"},{"id":212,"nm":"宁德","py":"ningde"},{"id":213,"nm":"景德镇","py":"jingdezhen"},{"id":214,"nm":"萍乡","py":"pingxiang"},{"id":215,"nm":"新余","py":"xinyu"},{"id":208,"nm":"三明","py":"sanming"},{"id":209,"nm":"漳州","py":"zhangzhou"},{"id":210,"nm":"南平","py":"nanping"},{"id":211,"nm":"龙岩","py":"longyan"},{"id":239,"nm":"鹤壁","py":"hebi"},{"id":238,"nm":"安阳","py":"anyang"},{"id":237,"nm":"平顶山","py":"pingdingshan"},{"id":236,"nm":"洛阳","py":"luoyang"},{"id":235,"nm":"开封","py":"kaifeng"},{"id":234,"nm":"菏泽","py":"heze"},{"id":233,"nm":"滨州","py":"binzhou"},{"id":232,"nm":"聊城","py":"liaocheng"},{"id":231,"nm":"德州","py":"dezhou"},{"id":230,"nm":"临沂","py":"linyi"},{"id":229,"nm":"莱芜","py":"laiwu"},{"id":228,"nm":"日照","py":"rizhao"},{"id":227,"nm":"威海","py":"weihai"},{"id":226,"nm":"泰安","py":"taian"},{"id":225,"nm":"济宁","py":"jining"},{"id":224,"nm":"潍坊","py":"weifang"},{"id":254,"nm":"鄂州","py":"ezhou"},{"id":255,"nm":"荆门","py":"jingmen"},{"id":252,"nm":"宜昌","py":"yichang"},{"id":253,"nm":"襄阳","py":"xiangyang"},{"id":250,"nm":"黄石","py":"huangshi"},{"id":251,"nm":"十堰","py":"shiyan"},{"id":248,"nm":"驻马店","py":"zhumadian"},{"id":249,"nm":"济源","py":"jiyuan"},{"id":246,"nm":"信阳","py":"xinyang"},{"id":247,"nm":"周口","py":"zhoukou"},{"id":244,"nm":"南阳","py":"nanyang"},{"id":245,"nm":"商丘","py":"shangqiu"},{"id":242,"nm":"漯河","py":"luohe"},{"id":243,"nm":"三门峡","py":"sanmenxia"},{"id":240,"nm":"濮阳","py":"puyang"},{"id":241,"nm":"许昌","py":"xuchang"},{"id":275,"nm":"湘西","py":"xiangxi"},{"id":274,"nm":"娄底","py":"loudi"},{"id":273,"nm":"怀化","py":"huaihua"},{"id":272,"nm":"永州","py":"yongzhou"},{"id":279,"nm":"茂名","py":"maoming"},{"id":278,"nm":"湛江","py":"zhanjiang"},{"id":277,"nm":"江门","py":"jiangmen"},{"id":276,"nm":"韶关","py":"shaoguan"},{"id":283,"nm":"汕尾","py":"shanwei"},{"id":282,"nm":"梅州","py":"meizhou"},{"id":281,"nm":"惠州","py":"huizhou"},{"id":280,"nm":"肇庆","py":"zhaoqing"},{"id":287,"nm":"潮州","py":"chaozhou"},{"id":286,"nm":"清远","py":"qingyuan"},{"id":285,"nm":"阳江","py":"yangjiang"},{"id":284,"nm":"河源","py":"heyuan"},{"id":258,"nm":"黄冈","py":"huanggang"},{"id":259,"nm":"咸宁","py":"xianning"},{"id":256,"nm":"孝感","py":"xiaogan"},{"id":257,"nm":"荆州","py":"jingzhou"},{"id":263,"nm":"株洲","py":"zhuzhou"},{"id":260,"nm":"随州","py":"suizhou"},{"id":261,"nm":"恩施","py":"enshi"},{"id":266,"nm":"邵阳","py":"shaoyang"},{"id":267,"nm":"岳阳","py":"yueyang"},{"id":264,"nm":"湘潭","py":"xiangtan"},{"id":265,"nm":"衡阳","py":"hengyang"},{"id":270,"nm":"益阳","py":"yiyang"},{"id":271,"nm":"郴州","py":"chenzhou"},{"id":268,"nm":"常德","py":"changde"},{"id":269,"nm":"张家界","py":"zhangjiajie"},{"id":305,"nm":"德阳","py":"deyang"},{"id":304,"nm":"泸州","py":"luzhou"},{"id":307,"nm":"广元","py":"guangyuan"},{"id":306,"nm":"绵阳","py":"mianyang"},{"id":309,"nm":"内江","py":"neijiang"},{"id":308,"nm":"遂宁","py":"suining"},{"id":311,"nm":"南充","py":"nanchong"},{"id":310,"nm":"乐山","py":"leshan"},{"id":313,"nm":"宜宾","py":"yibin"},{"id":312,"nm":"眉山","py":"meishan"},{"id":315,"nm":"达州","py":"dazhou"},{"id":314,"nm":"广安","py":"guangan"},{"id":317,"nm":"巴中","py":"bazhong"},{"id":316,"nm":"雅安","py":"yaan"},{"id":319,"nm":"阿坝","py":"aba"},{"id":318,"nm":"资阳","py":"ziyang"},{"id":288,"nm":"揭阳","py":"jieyang"},{"id":289,"nm":"云浮","py":"yunfu"},{"id":290,"nm":"柳州","py":"liuzhou"},{"id":291,"nm":"梧州","py":"wuzhou"},{"id":292,"nm":"北海","py":"beihai"},{"id":293,"nm":"防城港","py":"fangchenggang"},{"id":294,"nm":"钦州","py":"qinzhou"},{"id":295,"nm":"贵港","py":"guigang"},{"id":296,"nm":"玉林","py":"yulin"},{"id":297,"nm":"百色","py":"baise"},{"id":298,"nm":"贺州","py":"hezhou"},{"id":299,"nm":"河池","py":"hechi"},{"id":300,"nm":"来宾","py":"laibin"},{"id":301,"nm":"崇左","py":"chongzuo"},{"id":302,"nm":"自贡","py":"zigong"},{"id":303,"nm":"攀枝花","py":"panzhihua"},{"id":343,"nm":"怒江","py":"nujiang"},{"id":342,"nm":"德宏","py":"dehong"},{"id":341,"nm":"大理","py":"dali"},{"id":340,"nm":"西双版纳","py":"xishuangbanna"},{"id":339,"nm":"文山","py":"wenshan"},{"id":338,"nm":"红河","py":"honghe"},{"id":337,"nm":"楚雄","py":"chuxiong"},{"id":336,"nm":"临沧","py":"lincang"},{"id":351,"nm":"林芝","py":"linzhi"},{"id":348,"nm":"日喀则","py":"rikaze"},{"id":345,"nm":"拉萨","py":"lasa"},{"id":344,"nm":"迪庆","py":"diqing"},{"id":326,"nm":"黔西南","py":"qianxinan"},{"id":327,"nm":"毕节","py":"bijiediqu"},{"id":324,"nm":"安顺","py":"anshun"},{"id":325,"nm":"铜仁","py":"tongrendiqu"},{"id":322,"nm":"六盘水","py":"liupanshui"},{"id":323,"nm":"遵义","py":"zunyi"},{"id":320,"nm":"甘孜","py":"ganzi"},{"id":321,"nm":"凉山","py":"liangshan"},{"id":334,"nm":"丽江","py":"lijiang"},{"id":335,"nm":"普洱","py":"puer"},{"id":332,"nm":"保山","py":"baoshan"},{"id":333,"nm":"昭通","py":"zhaotong"},{"id":330,"nm":"曲靖","py":"qujing"},{"id":331,"nm":"玉溪","py":"yuxi"},{"id":328,"nm":"黔东南","py":"qiandongnan"},{"id":329,"nm":"黔南","py":"qiannan"},{"id":373,"nm":"甘南","py":"gannan"},{"id":372,"nm":"临夏","py":"linxia"},{"id":375,"nm":"海东","py":"haidong"},{"id":374,"nm":"西宁","py":"xining"},{"id":369,"nm":"庆阳","py":"qingyang"},{"id":368,"nm":"酒泉","py":"jiuquan"},{"id":371,"nm":"陇南","py":"longnan"},{"id":370,"nm":"定西","py":"dingxi"},{"id":381,"nm":"海西","py":"haixi"},{"id":380,"nm":"玉树","py":"yushu"},{"id":383,"nm":"石嘴山","py":"shizuishan"},{"id":382,"nm":"银川","py":"yinchuan"},{"id":377,"nm":"黄南","py":"huangnan"},{"id":378,"nm":"海南州","py":"hainanzhou"},{"id":356,"nm":"延安","py":"yanan"},{"id":357,"nm":"汉中","py":"hanzhong"},{"id":358,"nm":"榆林","py":"yulinyl"},{"id":359,"nm":"安康","py":"ankang"},{"id":352,"nm":"铜川","py":"tongchuan"},{"id":353,"nm":"宝鸡","py":"baoji"},{"id":354,"nm":"咸阳","py":"xianyang"},{"id":355,"nm":"渭南","py":"weinan"},{"id":364,"nm":"天水","py":"tianshui"},{"id":365,"nm":"武威","py":"wuwei"},{"id":366,"nm":"张掖","py":"zhangye"},{"id":367,"nm":"平凉","py":"pingliang"},{"id":360,"nm":"商洛","py":"shangluo"},{"id":361,"nm":"兰州","py":"lanzhou"},{"id":362,"nm":"金昌","py":"jinchang"},{"id":363,"nm":"白银","py":"baiyin"},{"id":408,"nm":"石河子","py":"shihezi"},{"id":409,"nm":"嘉峪关","py":"jiayuguan"},{"id":412,"nm":"仙桃","py":"xiantao"},{"id":403,"nm":"昆山","py":"kunshan"},{"id":400,"nm":"阿勒泰","py":"aletai"},{"id":406,"nm":"顺德","py":"shunde"},{"id":404,"nm":"江阴","py":"jiangyin"},{"id":405,"nm":"义乌","py":"yiwu"},{"id":394,"nm":"阿克苏","py":"akesu"},{"id":393,"nm":"巴州","py":"bazhou"},{"id":392,"nm":"博尔塔拉","py":"boertala"},{"id":399,"nm":"塔城","py":"tacheng"},{"id":398,"nm":"伊犁","py":"yili"},{"id":397,"nm":"和田","py":"hetian"},{"id":396,"nm":"喀什地区","py":"kashi"},{"id":387,"nm":"乌鲁木齐","py":"wulumuqi"},{"id":386,"nm":"中卫","py":"zhongwei"},{"id":385,"nm":"固原","py":"guyuan"},{"id":384,"nm":"吴忠","py":"wuzhong"},{"id":391,"nm":"昌吉","py":"changji"},{"id":390,"nm":"哈密","py":"hami"},{"id":389,"nm":"吐鲁番","py":"tulufan"},{"id":388,"nm":"克拉玛依","py":"kelamayi"},{"id":440,"nm":"石狮","py":"shishi"},{"id":443,"nm":"武夷山","py":"wuyishan"},{"id":432,"nm":"太仓","py":"taicang"},{"id":433,"nm":"吴江","py":"wujiang"},{"id":434,"nm":"敦煌","py":"dunhuang"},{"id":439,"nm":"靖江","py":"jingjiang"},{"id":425,"nm":"桐乡","py":"tongxiang"},{"id":424,"nm":"海宁","py":"haining"},{"id":427,"nm":"涪陵","py":"fuling"},{"id":426,"nm":"涿州","py":"zhuozhou"},{"id":428,"nm":"万州","py":"wanzhou"},{"id":431,"nm":"丹阳","py":"danyang"},{"id":430,"nm":"迁安","py":"qianan"},{"id":417,"nm":"峨眉山","py":"emeishan"},{"id":416,"nm":"富阳","py":"fuyangfy"},{"id":419,"nm":"张家港","py":"zhangjiagang"},{"id":418,"nm":"琼海","py":"qionghai"},{"id":421,"nm":"从化","py":"conghua"},{"id":420,"nm":"晋江市","py":"jinjiangshi"},{"id":422,"nm":"常熟","py":"changshu"},{"id":478,"nm":"东台","py":"dongtai"},{"id":479,"nm":"婺源","py":"wuyuan"},{"id":476,"nm":"兰溪","py":"lanxi"},{"id":477,"nm":"大丰","py":"dafeng"},{"id":475,"nm":"仁怀","py":"renhuai"},{"id":472,"nm":"惠阳","py":"huiyang"},{"id":473,"nm":"凯里","py":"kaili"},{"id":470,"nm":"乐清","py":"yueqing"},{"id":471,"nm":"惠东","py":"huidong"},{"id":468,"nm":"诸暨","py":"zhuji"},{"id":469,"nm":"瑞安","py":"ruian"},{"id":466,"nm":"阳朔","py":"yangshuo"},{"id":467,"nm":"德清","py":"deqing"},{"id":465,"nm":"章丘区","py":"zhangqiuqu"},{"id":463,"nm":"长乐","py":"changle"},{"id":462,"nm":"福清","py":"fuqing"},{"id":461,"nm":"临海","py":"linhai"},{"id":460,"nm":"金坛","py":"jintan"},{"id":459,"nm":"余姚","py":"yuyao"},{"id":458,"nm":"永康","py":"yongkang"},{"id":457,"nm":"温岭","py":"wenling"},{"id":456,"nm":"上虞","py":"shangyu"},{"id":455,"nm":"东阳","py":"dongyang"},{"id":454,"nm":"宜兴","py":"yixing"},{"id":453,"nm":"兖州","py":"yanzhou"},{"id":452,"nm":"长兴","py":"changxing"},{"id":451,"nm":"慈溪","py":"cixi"},{"id":450,"nm":"溧阳","py":"liyang"},{"id":449,"nm":"武安","py":"wuan"},{"id":508,"nm":"邹平","py":"zouping"},{"id":509,"nm":"耒阳","py":"leiyang"},{"id":510,"nm":"江山","py":"jiangshan"},{"id":504,"nm":"鹤山","py":"heshan"},{"id":505,"nm":"桦甸","py":"huadian"},{"id":506,"nm":"海城","py":"haicheng"},{"id":507,"nm":"曲阜","py":"qufu"},{"id":500,"nm":"启东","py":"qidong"},{"id":501,"nm":"如皋","py":"rugao"},{"id":502,"nm":"开平","py":"kaiping"},{"id":503,"nm":"台山","py":"taishan"},{"id":496,"nm":"青州","py":"qingzhou"},{"id":497,"nm":"荣成","py":"rongcheng"},{"id":498,"nm":"文登","py":"wendeng"},{"id":499,"nm":"乳山","py":"rushan"},{"id":493,"nm":"邳州","py":"pizhou"},{"id":492,"nm":"龙口","py":"longkou"},{"id":495,"nm":"寿光","py":"shouguang"},{"id":494,"nm":"枣阳","py":"zaoyang"},{"id":489,"nm":"嘉善","py":"jiashan"},{"id":491,"nm":"当阳","py":"dangyang"},{"id":490,"nm":"安吉","py":"anji"},{"id":485,"nm":"井冈山","py":"jinggangshan"},{"id":484,"nm":"香格里拉","py":"xianggelila"},{"id":487,"nm":"神农架","py":"shennongjia"},{"id":486,"nm":"武当山","py":"wudangshan"},{"id":480,"nm":"凤凰","py":"fenghuang"},{"id":482,"nm":"腾冲","py":"tengchong"},{"id":550,"nm":"潜江","py":"qianjiang"},{"id":551,"nm":"乌镇","py":"wuzhen"},{"id":548,"nm":"新沂","py":"xinyi"},{"id":549,"nm":"滕州","py":"tengzhou"},{"id":546,"nm":"普宁","py":"puning"},{"id":547,"nm":"南沙","py":"nansha"},{"id":544,"nm":"晋州","py":"jinzhoushi"},{"id":545,"nm":"肥城","py":"feicheng"},{"id":558,"nm":"庄河","py":"zhuanghe"},{"id":559,"nm":"扬中","py":"yangzhong"},{"id":556,"nm":"新密","py":"xinmi"},{"id":557,"nm":"荥阳","py":"xingyang"},{"id":554,"nm":"桐庐","py":"tonglu"},{"id":555,"nm":"新郑","py":"xinzheng"},{"id":552,"nm":"登封","py":"dengfeng"},{"id":553,"nm":"巩义","py":"gongyishi"},{"id":567,"nm":"陆丰","py":"lufeng"},{"id":566,"nm":"密山","py":"mishan"},{"id":564,"nm":"华阴","py":"huayin"},{"id":563,"nm":"漠河","py":"mohe"},{"id":562,"nm":"兴宁","py":"xingning"},{"id":561,"nm":"莱阳","py":"laiyang"},{"id":560,"nm":"西塘","py":"xitang"},{"id":575,"nm":"霸州","py":"hbbazhou"},{"id":574,"nm":"新民","py":"xinmin"},{"id":573,"nm":"海阳","py":"haiyang"},{"id":572,"nm":"满洲里","py":"manzhouli"},{"id":571,"nm":"儋州","py":"danzhou"},{"id":570,"nm":"桂平","py":"guiping"},{"id":569,"nm":"韶山","py":"shaoshan"},{"id":568,"nm":"额尔古纳","py":"eerguna"},{"id":516,"nm":"伊川","py":"yichuan"},{"id":517,"nm":"兴化","py":"xinghua"},{"id":518,"nm":"泰兴","py":"taixing"},{"id":519,"nm":"海门","py":"haimen"},{"id":512,"nm":"宁海","py":"ninghai"},{"id":513,"nm":"乐昌","py":"lechang"},{"id":514,"nm":"英德","py":"yingde"},{"id":515,"nm":"句容","py":"jurong"},{"id":524,"nm":"平湖","py":"pinghu"},{"id":525,"nm":"湘阴","py":"xiangyin"},{"id":526,"nm":"诸城","py":"zhucheng"},{"id":527,"nm":"昌邑","py":"changyi"},{"id":520,"nm":"宁乡","py":"ningxiang"},{"id":521,"nm":"高邮","py":"gaoyou"},{"id":522,"nm":"仪征","py":"yizheng"},{"id":523,"nm":"新泰","py":"xintai"},{"id":533,"nm":"滨海","py":"binhai"},{"id":532,"nm":"射阳","py":"sheyang"},{"id":535,"nm":"阜宁","py":"funing"},{"id":534,"nm":"响水","py":"xiangshui"},{"id":529,"nm":"莱州","py":"laizhou"},{"id":528,"nm":"偃师","py":"yanshi"},{"id":531,"nm":"沭阳","py":"shuyang"},{"id":530,"nm":"嵊州","py":"shengzhou"},{"id":541,"nm":"广饶","py":"guangrao"},{"id":540,"nm":"奉化","py":"fenghua"},{"id":543,"nm":"辛集","py":"xinji"},{"id":542,"nm":"临安","py":"linan"},{"id":537,"nm":"临清","py":"linqing"},{"id":536,"nm":"建湖","py":"jianhu"},{"id":539,"nm":"东港","py":"donggang"},{"id":538,"nm":"三河","py":"sanhe"},{"id":610,"nm":"明光","py":"mingguang"},{"id":611,"nm":"乐陵","py":"laoling"},{"id":608,"nm":"禹城","py":"yucheng"},{"id":609,"nm":"禹州","py":"yuzhou"},{"id":614,"nm":"湘乡","py":"xiangxiang"},{"id":612,"nm":"钟祥","py":"zhongxiang"},{"id":613,"nm":"沙河","py":"shahe"},{"id":618,"nm":"龙海","py":"longhai"},{"id":619,"nm":"醴陵","py":"liling"},{"id":616,"nm":"汝州","py":"ruzhou"},{"id":617,"nm":"浏阳","py":"liuyang"},{"id":622,"nm":"伊宁","py":"yining"},{"id":623,"nm":"海安","py":"haian"},{"id":620,"nm":"莱西","py":"laixi"},{"id":621,"nm":"南安","py":"nanan"},{"id":627,"nm":"长葛","py":"changge"},{"id":626,"nm":"天长","py":"tianchang"},{"id":625,"nm":"宜城","py":"yicheng"},{"id":624,"nm":"苍南","py":"cangnan"},{"id":631,"nm":"高州","py":"gaozhou"},{"id":630,"nm":"个旧","py":"gejiu"},{"id":629,"nm":"高碑店","py":"gaobeidian"},{"id":628,"nm":"廉江","py":"lianjiang"},{"id":635,"nm":"东兴","py":"dongxing"},{"id":634,"nm":"阆中","py":"langzhong"},{"id":633,"nm":"四会","py":"sihui"},{"id":632,"nm":"乐平","py":"leping"},{"id":639,"nm":"瑞金","py":"ruijin"},{"id":638,"nm":"盖州","py":"gaizhou"},{"id":637,"nm":"原平","py":"yuanping"},{"id":636,"nm":"介休","py":"jiexiu"},{"id":576,"nm":"都江堰","py":"dujiangyan"},{"id":577,"nm":"永城","py":"yongcheng"},{"id":578,"nm":"天门","py":"tianmen"},{"id":579,"nm":"侯马","py":"houma"},{"id":580,"nm":"项城","py":"xiangcheng"},{"id":581,"nm":"公主岭","py":"gongzhuling"},{"id":582,"nm":"平度","py":"pingdu"},{"id":583,"nm":"胶州","py":"jiaozhou"},{"id":584,"nm":"梅河口","py":"meihekou"},{"id":585,"nm":"彭州","py":"pengzhou"},{"id":586,"nm":"招远","py":"zhaoyuan"},{"id":587,"nm":"蓬莱","py":"penglai"},{"id":588,"nm":"安丘","py":"anqiu"},{"id":589,"nm":"高密","py":"gaomi"},{"id":590,"nm":"汨罗","py":"miluo"},{"id":591,"nm":"遵化","py":"zunhua"},{"id":593,"nm":"广汉","py":"guanghan"},{"id":592,"nm":"吴川","py":"wuchuan"},{"id":595,"nm":"藁城","py":"gaocheng"},{"id":594,"nm":"建德","py":"jiande"},{"id":597,"nm":"永济","py":"yongji"},{"id":596,"nm":"灵宝","py":"lingbao"},{"id":599,"nm":"大石桥","py":"dashiqiao"},{"id":598,"nm":"河津","py":"hejin"},{"id":601,"nm":"高平","py":"gaoping"},{"id":600,"nm":"大冶","py":"daye"},{"id":603,"nm":"库尔勒","py":"kuerle"},{"id":602,"nm":"宝应","py":"baoying"},{"id":605,"nm":"简阳","py":"jianyang"},{"id":604,"nm":"孝义","py":"xiaoyi"},{"id":607,"nm":"文昌","py":"wenchang"},{"id":606,"nm":"冷水江","py":"lengshuijiang"},{"id":687,"nm":"南雄","py":"nanxiong"},{"id":686,"nm":"东方","py":"dongfang"},{"id":685,"nm":"海林","py":"hailin"},{"id":684,"nm":"舞钢","py":"wugang"},{"id":683,"nm":"连州","py":"lianzhou"},{"id":682,"nm":"讷河","py":"nehe"},{"id":681,"nm":"北流","py":"beiliu"},{"id":680,"nm":"万宁","py":"wanning"},{"id":679,"nm":"大通","py":"datongshi"},{"id":678,"nm":"集安","py":"jianshi"},{"id":677,"nm":"汾阳","py":"fenyang"},{"id":675,"nm":"灵山","py":"lingshan"},{"id":674,"nm":"滦南","py":"luannan"},{"id":673,"nm":"桐城","py":"tongcheng"},{"id":672,"nm":"化州","py":"huazhou"},{"id":702,"nm":"格尔木","py":"geermu"},{"id":700,"nm":"承德县","py":"chengdexian"},{"id":701,"nm":"鄱阳","py":"poyang"},{"id":698,"nm":"博爱","py":"boai"},{"id":699,"nm":"安岳","py":"anyue"},{"id":696,"nm":"温县","py":"wenxian"},{"id":697,"nm":"武陟","py":"wuzhi"},{"id":694,"nm":"孟州","py":"mengzhou"},{"id":695,"nm":"修武","py":"xiuwu"},{"id":692,"nm":"象山","py":"xiangshan"},{"id":693,"nm":"玉环市","py":"yuhuanshi"},{"id":690,"nm":"临江","py":"linjiang"},{"id":691,"nm":"古交","py":"gujiao"},{"id":688,"nm":"陵水","py":"lingshui"},{"id":689,"nm":"阜康","py":"fukang"},{"id":653,"nm":"赤壁","py":"chibi"},{"id":652,"nm":"鹿泉","py":"luquan"},{"id":655,"nm":"利川","py":"lichuan"},{"id":654,"nm":"枝江","py":"zhijiang"},{"id":648,"nm":"松滋","py":"songzi"},{"id":651,"nm":"灯塔","py":"dengta"},{"id":650,"nm":"黄骅","py":"huanghua"},{"id":645,"nm":"霍州","py":"huozhou"},{"id":644,"nm":"沁阳","py":"qinyang"},{"id":647,"nm":"邛崃","py":"qionglai"},{"id":646,"nm":"崇州","py":"chongzhou"},{"id":641,"nm":"兴城","py":"xingcheng"},{"id":643,"nm":"奎屯","py":"kuitun"},{"id":642,"nm":"调兵山","py":"diaobingshan"},{"id":668,"nm":"麻城","py":"macheng"},{"id":669,"nm":"舒兰","py":"shulan"},{"id":670,"nm":"凌海","py":"linghai"},{"id":671,"nm":"樟树","py":"zhangshu"},{"id":664,"nm":"即墨","py":"jimo"},{"id":665,"nm":"凤城","py":"fengcheng"},{"id":666,"nm":"洮南","py":"taonan"},{"id":667,"nm":"武穴","py":"wuxue"},{"id":660,"nm":"淳安","py":"chunan"},{"id":662,"nm":"邓州","py":"dengzhou"},{"id":663,"nm":"漳浦","py":"zhangpu"},{"id":656,"nm":"宜都","py":"yidu"},{"id":657,"nm":"瑞昌","py":"ruichang"},{"id":658,"nm":"沅江","py":"yuanjiang"},{"id":659,"nm":"老河口","py":"laohekou"},{"id":747,"nm":"乌苏","py":"wusu"},{"id":746,"nm":"曹妃甸","py":"caofeidian"},{"id":745,"nm":"滦州市","py":"luanzhoushi"},{"id":744,"nm":"乐亭","py":"laoting"},{"id":751,"nm":"灌云","py":"guanyun"},{"id":750,"nm":"电白","py":"dianbai"},{"id":749,"nm":"仁寿","py":"renshou"},{"id":748,"nm":"开州区","py":"kaizhouqu"},{"id":739,"nm":"临朐","py":"linqu"},{"id":738,"nm":"东平","py":"dongping"},{"id":737,"nm":"昌乐","py":"changlecl"},{"id":736,"nm":"邵东","py":"shaodong"},{"id":743,"nm":"台前","py":"taiqian"},{"id":742,"nm":"范县","py":"fanxian"},{"id":741,"nm":"南乐","py":"nanle"},{"id":740,"nm":"清丰","py":"qingfeng"},{"id":762,"nm":"沙湾","py":"shawan"},{"id":763,"nm":"永年","py":"yongnian"},{"id":760,"nm":"泗阳","py":"siyang"},{"id":761,"nm":"磐石","py":"panshi"},{"id":766,"nm":"栾城","py":"luancheng"},{"id":767,"nm":"磁县","py":"cixian"},{"id":764,"nm":"仙居","py":"xianju"},{"id":765,"nm":"定州","py":"dingzhou"},{"id":754,"nm":"东海","py":"donghai"},{"id":755,"nm":"睢县","py":"suixian"},{"id":752,"nm":"灌南","py":"guannan"},{"id":753,"nm":"赣榆","py":"ganyu"},{"id":758,"nm":"淮阳","py":"huaiyang"},{"id":759,"nm":"太和","py":"taihe"},{"id":756,"nm":"建阳","py":"jianyangjy"},{"id":757,"nm":"正定","py":"zhengding"},{"id":728,"nm":"夏津","py":"xiajin"},{"id":729,"nm":"信宜","py":"xinyixy"},{"id":730,"nm":"浦江","py":"pujiang"},{"id":731,"nm":"北碚","py":"beipei"},{"id":732,"nm":"合川","py":"hechuan"},{"id":733,"nm":"永川","py":"yongchuan"},{"id":734,"nm":"新化","py":"xinhua"},{"id":735,"nm":"丰城","py":"fch"},{"id":724,"nm":"连江","py":"lianjiangxian"},{"id":725,"nm":"蛟河","py":"jiaohe"},{"id":726,"nm":"海盐","py":"haiyan"},{"id":727,"nm":"齐河","py":"qihe"},{"id":821,"nm":"中牟","py":"zhongmou"},{"id":820,"nm":"宁津","py":"ningjinnj"},{"id":823,"nm":"隆昌市","py":"longchangshi"},{"id":822,"nm":"阎良","py":"yanliang"},{"id":817,"nm":"汤阴","py":"tangyin"},{"id":816,"nm":"滑县","py":"huaxian"},{"id":819,"nm":"石泉","py":"shiquan"},{"id":818,"nm":"新安","py":"xinan"},{"id":829,"nm":"原阳","py":"yuanyang"},{"id":828,"nm":"新乡县","py":"xinxiangxian"},{"id":831,"nm":"监利","py":"jianli"},{"id":830,"nm":"单县","py":"shanxian"},{"id":825,"nm":"惠安","py":"huian"},{"id":824,"nm":"泗洪","py":"sihong"},{"id":827,"nm":"封丘","py":"fengqiu"},{"id":826,"nm":"卫辉","py":"weihui"},{"id":804,"nm":"上高","py":"shanggao"},{"id":805,"nm":"平潭","py":"pingtan"},{"id":806,"nm":"怀仁市","py":"huairenxian"},{"id":807,"nm":"安平","py":"anping"},{"id":800,"nm":"辉县","py":"huixian"},{"id":801,"nm":"昌黎","py":"changli"},{"id":802,"nm":"宣威","py":"xuanwei"},{"id":803,"nm":"易县","py":"yixian"},{"id":812,"nm":"藤县","py":"tengxian"},{"id":813,"nm":"宁晋","py":"ningjin"},{"id":814,"nm":"宜阳","py":"yiyangyy"},{"id":815,"nm":"林州","py":"linzhou"},{"id":808,"nm":"临潼","py":"lintong"},{"id":809,"nm":"蓝田","py":"lantian"},{"id":810,"nm":"霞浦","py":"xiapu"},{"id":811,"nm":"岑溪","py":"cenxi"},{"id":791,"nm":"临漳","py":"linzhang"},{"id":790,"nm":"太谷","py":"taigu"},{"id":789,"nm":"灵石","py":"lingshi"},{"id":788,"nm":"金堂","py":"jintang"},{"id":787,"nm":"共青城","py":"gongqingcheng"},{"id":786,"nm":"鲁山","py":"lushanls"},{"id":785,"nm":"郏县","py":"jiaxian"},{"id":784,"nm":"叶县","py":"yexian"},{"id":799,"nm":"户县","py":"huxian"},{"id":798,"nm":"成安","py":"chengan"},{"id":797,"nm":"绥中","py":"suizhong"},{"id":796,"nm":"神木市","py":"shenmushi"},{"id":795,"nm":"长垣","py":"changyuan"},{"id":794,"nm":"和县","py":"hexian"},{"id":793,"nm":"含山","py":"hanshan"},{"id":792,"nm":"肥乡区","py":"feixiangqu"},{"id":774,"nm":"繁昌","py":"fanchang"},{"id":775,"nm":"南陵","py":"nanling"},{"id":772,"nm":"汉阴","py":"hanyin"},{"id":773,"nm":"芜湖县","py":"wuhuxian"},{"id":770,"nm":"阳城","py":"yangcheng"},{"id":771,"nm":"高安","py":"gaoan"},{"id":768,"nm":"涉县","py":"shexian"},{"id":769,"nm":"无为","py":"wuweiww"},{"id":782,"nm":"天台","py":"tiantai"},{"id":783,"nm":"宝丰","py":"baofeng"},{"id":780,"nm":"广德","py":"guangde"},{"id":781,"nm":"宁国","py":"ningguo"},{"id":778,"nm":"云阳","py":"yunyang"},{"id":779,"nm":"宁阳","py":"ningyang"},{"id":776,"nm":"襄垣","py":"xiangyuan"},{"id":777,"nm":"平原","py":"pingyuan"},{"id":881,"nm":"河口","py":"hekou"},{"id":880,"nm":"垦利","py":"kenli"},{"id":883,"nm":"曹县","py":"caoxian"},{"id":882,"nm":"巨野","py":"juye"},{"id":885,"nm":"西平","py":"xiping"},{"id":884,"nm":"郓城","py":"yunchengxian"},{"id":887,"nm":"泌阳","py":"biyang"},{"id":886,"nm":"上蔡","py":"shangcai"},{"id":889,"nm":"临猗","py":"linyixian"},{"id":888,"nm":"富顺","py":"fushunxian"},{"id":891,"nm":"准格尔旗","py":"zhungeerqi"},{"id":893,"nm":"平山","py":"pingshan"},{"id":892,"nm":"新乐","py":"xinle"},{"id":895,"nm":"遂昌","py":"suichang"},{"id":894,"nm":"辉南","py":"huinan"},{"id":864,"nm":"淇县","py":"qixian"},{"id":865,"nm":"全椒","py":"quanjiao"},{"id":866,"nm":"高陵","py":"gaoling"},{"id":867,"nm":"洪洞","py":"hongtong"},{"id":868,"nm":"柳河","py":"liuhe"},{"id":869,"nm":"抚松","py":"fusong"},{"id":870,"nm":"西乡","py":"xixiang"},{"id":871,"nm":"江津","py":"jiangjin"},{"id":872,"nm":"渑池","py":"mianchi"},{"id":873,"nm":"安宁","py":"anning"},{"id":874,"nm":"达拉特旗","py":"dalateqi"},{"id":875,"nm":"睢宁","py":"suiningxian"},{"id":876,"nm":"玉山","py":"yushan"},{"id":877,"nm":"茌平","py":"chiping"},{"id":878,"nm":"阳谷","py":"yanggu"},{"id":879,"nm":"土默特右旗","py":"tumoteyouqi"},{"id":851,"nm":"横店","py":"hengdian"},{"id":850,"nm":"乌拉特前旗","py":"wltqq"},{"id":849,"nm":"濮阳县","py":"puyangxian"},{"id":848,"nm":"眉县","py":"meixian"},{"id":854,"nm":"高阳","py":"gaoyang"},{"id":853,"nm":"徐闻","py":"xuwen"},{"id":852,"nm":"博兴","py":"boxing"},{"id":859,"nm":"虞城","py":"yuchengxian"},{"id":858,"nm":"柘城","py":"zhecheng"},{"id":857,"nm":"夏邑","py":"xiayi"},{"id":856,"nm":"华亭市","py":"huatingshi"},{"id":863,"nm":"浚县","py":"xunxian"},{"id":862,"nm":"丰县","py":"fengxian"},{"id":861,"nm":"扶风","py":"fufeng"},{"id":860,"nm":"民权","py":"minquan"},{"id":834,"nm":"邹城","py":"zoucheng"},{"id":835,"nm":"郸城","py":"dancheng"},{"id":832,"nm":"韩城","py":"hancheng"},{"id":833,"nm":"沛县","py":"peixian"},{"id":838,"nm":"孟津","py":"mengjin"},{"id":839,"nm":"鹿邑","py":"luyi"},{"id":836,"nm":"大荔","py":"dalixian"},{"id":837,"nm":"蒲城","py":"pucheng"},{"id":842,"nm":"盘州市","py":"panzhoushi"},{"id":843,"nm":"盱眙","py":"xuyi"},{"id":840,"nm":"沈丘","py":"shenqiu"},{"id":841,"nm":"赵县","py":"zhaoxian"},{"id":846,"nm":"牟平","py":"muping"},{"id":847,"nm":"平江","py":"pingjiang"},{"id":844,"nm":"安溪","py":"anxi"},{"id":845,"nm":"三门","py":"sanmen"},{"id":956,"nm":"金湖","py":"jinhu"},{"id":957,"nm":"香河","py":"xianghe"},{"id":958,"nm":"于都","py":"yudu"},{"id":959,"nm":"信丰","py":"xinfeng"},{"id":952,"nm":"博山","py":"boshan"},{"id":953,"nm":"什邡","py":"shifang"},{"id":954,"nm":"长汀","py":"changting"},{"id":955,"nm":"上杭","py":"shanghang"},{"id":948,"nm":"江都","py":"jiangdu"},{"id":949,"nm":"浠水","py":"xishui"},{"id":950,"nm":"平邑","py":"pingyi"},{"id":951,"nm":"临沭","py":"linshu"},{"id":944,"nm":"蒙阴","py":"mengyin"},{"id":945,"nm":"大洼","py":"dawa"},{"id":946,"nm":"璧山","py":"bishan"},{"id":947,"nm":"铜梁","py":"tongliang"},{"id":941,"nm":"莒南","py":"junan"},{"id":940,"nm":"沂水","py":"yishui"},{"id":943,"nm":"沂南","py":"yinan"},{"id":942,"nm":"郯城","py":"tancheng"},{"id":937,"nm":"扶沟","py":"fugou"},{"id":936,"nm":"西华","py":"xihua"},{"id":939,"nm":"兰陵","py":"lanling"},{"id":938,"nm":"龙游","py":"longyou"},{"id":935,"nm":"栾川","py":"luanchuan"},{"id":934,"nm":"雷州","py":"leizhou"},{"id":929,"nm":"清河","py":"qinghe"},{"id":928,"nm":"洪湖","py":"honghu"},{"id":931,"nm":"内丘","py":"neiqiu"},{"id":930,"nm":"隆尧","py":"longyao"},{"id":926,"nm":"围场","py":"weichang"},{"id":927,"nm":"江油","py":"jiangyou"},{"id":924,"nm":"丰宁","py":"fengning"},{"id":925,"nm":"宽城","py":"kuancheng"},{"id":922,"nm":"青田","py":"qingtian"},{"id":920,"nm":"薛城","py":"xuecheng"},{"id":921,"nm":"佛冈","py":"fogang"},{"id":918,"nm":"京山市","py":"jingshanshi"},{"id":919,"nm":"陵川","py":"lingchuan"},{"id":916,"nm":"费县","py":"feixian"},{"id":917,"nm":"任丘","py":"renqiu"},{"id":914,"nm":"栖霞","py":"qixia"},{"id":915,"nm":"彬州市","py":"binzhoushi"},{"id":912,"nm":"龙泉","py":"longquan"},{"id":913,"nm":"缙云","py":"jinyun"},{"id":911,"nm":"公安","py":"gongan"},{"id":910,"nm":"大竹","py":"dazhu"},{"id":909,"nm":"城固","py":"chenggu"},{"id":908,"nm":"杨陵","py":"yangling"},{"id":907,"nm":"石岛","py":"shidao"},{"id":906,"nm":"绵竹","py":"mianzhu"},{"id":905,"nm":"临邑","py":"linyily"},{"id":904,"nm":"武城","py":"wucheng"},{"id":903,"nm":"新昌","py":"xinchang"},{"id":902,"nm":"利津","py":"lijin"},{"id":901,"nm":"伊金霍洛旗","py":"yijinhuoluoqi"},{"id":900,"nm":"金乡","py":"jinxiang"},{"id":899,"nm":"嘉祥","py":"jiaxiang"},{"id":898,"nm":"汶上","py":"wenshang"},{"id":897,"nm":"微山","py":"weishan"},{"id":896,"nm":"梁山","py":"liangshanxian"},{"id":1017,"nm":"泗水","py":"sishui"},{"id":1018,"nm":"赤水","py":"chishui"},{"id":1019,"nm":"无极","py":"wuji"},{"id":1020,"nm":"青县","py":"qingxian"},{"id":1021,"nm":"淅川","py":"xichuan"},{"id":1022,"nm":"社旗","py":"sheqi"},{"id":1023,"nm":"万荣","py":"wanrong"},{"id":1008,"nm":"安化","py":"anhua"},{"id":1009,"nm":"桃源","py":"taoyuanxian"},{"id":1010,"nm":"澧县","py":"lixian"},{"id":1011,"nm":"辽中","py":"liaozhong"},{"id":1013,"nm":"南和","py":"nanhe"},{"id":1014,"nm":"舞阳","py":"wuyang"},{"id":1015,"nm":"商河","py":"shanghe"},{"id":1001,"nm":"金沙","py":"jinsha"},{"id":1003,"nm":"泾县","py":"jingxian"},{"id":1002,"nm":"开阳","py":"kaiyang"},{"id":1005,"nm":"怀宁","py":"huaining"},{"id":1004,"nm":"潜山市","py":"qianshanshi"},{"id":1007,"nm":"织金","py":"zhijin"},{"id":1006,"nm":"威宁","py":"weining"},{"id":993,"nm":"常山","py":"changshan"},{"id":992,"nm":"射洪","py":"shehong"},{"id":995,"nm":"武鸣","py":"wuming"},{"id":994,"nm":"宾阳","py":"binyang"},{"id":997,"nm":"芷江","py":"zhijiangtongzu"},{"id":996,"nm":"溆浦","py":"xupu"},{"id":999,"nm":"东光","py":"dongguang"},{"id":998,"nm":"庆云","py":"qingyun"},{"id":987,"nm":"平遥","py":"pingyao"},{"id":985,"nm":"周至","py":"zhouzhi"},{"id":990,"nm":"开化","py":"kaihua"},{"id":991,"nm":"平果","py":"pingguo"},{"id":988,"nm":"如东","py":"rudong"},{"id":989,"nm":"恩平","py":"enping"},{"id":978,"nm":"敦化","py":"dunhua"},{"id":979,"nm":"内黄","py":"neihuang"},{"id":976,"nm":"涟水","py":"lianshui"},{"id":977,"nm":"珲春","py":"hunchun"},{"id":982,"nm":"舒城","py":"shucheng"},{"id":980,"nm":"凤台","py":"fengtai"},{"id":981,"nm":"长寿","py":"changshou"},{"id":971,"nm":"大邑","py":"dayi"},{"id":970,"nm":"潮安","py":"chaoan"},{"id":975,"nm":"霍邱","py":"huoqiu"},{"id":974,"nm":"砀山","py":"dangshan"},{"id":973,"nm":"武义","py":"wuyi"},{"id":972,"nm":"平阳","py":"pingyang"},{"id":963,"nm":"集美","py":"jimei"},{"id":962,"nm":"同安","py":"tongan"},{"id":961,"nm":"新蔡","py":"xincai"},{"id":960,"nm":"平舆","py":"pingyu"},{"id":967,"nm":"瓦房店","py":"wafangdian"},{"id":966,"nm":"汝阳","py":"ruyang"},{"id":965,"nm":"嵩县","py":"songxian"},{"id":964,"nm":"海沧","py":"haicang"},{"id":1100,"nm":"长丰县","py":"changfengxian"},{"id":1101,"nm":"容县","py":"rongxian"},{"id":1102,"nm":"博白县","py":"bobaixian"},{"id":1103,"nm":"潢川县","py":"huangchuanxian"},{"id":1096,"nm":"攸县","py":"youxian"},{"id":1097,"nm":"茶陵","py":"chalingxian"},{"id":1098,"nm":"博罗县","py":"boluoxian"},{"id":1099,"nm":"永顺县","py":"yongshunxian"},{"id":1092,"nm":"常宁市","py":"changningshi"},{"id":1093,"nm":"资兴市","py":"zixingshi"},{"id":1094,"nm":"永兴县","py":"yongxingxian"},{"id":1095,"nm":"汝城县","py":"ruchengxian"},{"id":1088,"nm":"衡阳县","py":"hengyangxian"},{"id":1089,"nm":"祁东县","py":"qidongxian"},{"id":1090,"nm":"衡山县","py":"hengshanxian"},{"id":1091,"nm":"衡东县","py":"hengdongxian"},{"id":1116,"nm":"蒙自市","py":"mengzishi"},{"id":1119,"nm":"临澧","py":"linli"},{"id":1118,"nm":"石门","py":"shimen"},{"id":1113,"nm":"桑植","py":"sangzhi"},{"id":1112,"nm":"宁陵","py":"ninglingxian"},{"id":1115,"nm":"杞县","py":"qixiankaifeng"},{"id":1114,"nm":"荣昌区","py":"rongchangqu"},{"id":1109,"nm":"尉氏县","py":"weishixian"},{"id":1108,"nm":"商城县","py":"shangchengxian"},{"id":1111,"nm":"通许县","py":"tongxuxian"},{"id":1110,"nm":"兰考县","py":"lankaoxian"},{"id":1105,"nm":"贺兰县","py":"helanxian"},{"id":1104,"nm":"固始县","py":"gushixian"},{"id":1107,"nm":"庆安县","py":"qinganxian"},{"id":1106,"nm":"平罗县","py":"pingluoxian"},{"id":1134,"nm":"鄄城县","py":"juanchengxian"},{"id":1135,"nm":"通榆县","py":"tongyuxian"},{"id":1132,"nm":"通海县","py":"tonghaixian"},{"id":1133,"nm":"灵丘县","py":"lingqiuxian"},{"id":1130,"nm":"海伦市","py":"hailunshi"},{"id":1131,"nm":"青冈县","py":"qinggangxian"},{"id":1128,"nm":"武隆县","py":"wulongxian"},{"id":1129,"nm":"秀山土家族苗族自治县","py":"xiushantujiazumiaozuzizh"},{"id":1126,"nm":"阿勒泰市","py":"aletaishi"},{"id":1127,"nm":"酉阳土家族苗族自治县","py":"youyangtujiazumiaozuzizh"},{"id":1124,"nm":"汉南区","py":"hannanqu"},{"id":1125,"nm":"南郑区","py":"nanzhengxian"},{"id":1122,"nm":"蒙城","py":"mengcheng"},{"id":1123,"nm":"新洲区","py":"xinzhouqu"},{"id":1120,"nm":"鄯善县","py":"shanshanxian"},{"id":1121,"nm":"利辛","py":"lixin"},{"id":1151,"nm":"应县","py":"yingxian"},{"id":1150,"nm":"苍溪县","py":"cangxixian"},{"id":1149,"nm":"仙游县","py":"xianyouxian"},{"id":1147,"nm":"洛川县","py":"luochuanxian"},{"id":1146,"nm":"靖边","py":"jingbian"},{"id":1145,"nm":"合江县","py":"hejiangxian"},{"id":1144,"nm":"泸县","py":"luxian"},{"id":1143,"nm":"溧水区","py":"lishuiqu"},{"id":1142,"nm":"肥西县","py":"feixixian"},{"id":1141,"nm":"北镇市","py":"beizhenshi"},{"id":1140,"nm":"扎兰屯市","py":"zhalantunshi"},{"id":1139,"nm":"岐山县","py":"qishanxian"},{"id":1138,"nm":"禄丰县","py":"lufengxian"},{"id":1137,"nm":"新野","py":"xinye"},{"id":1136,"nm":"唐河","py":"tanghe"},{"id":1032,"nm":"江川县","py":"jiangchuanxian"},{"id":1033,"nm":"兴国县","py":"xingguoxian"},{"id":1034,"nm":"罗平县","py":"luopingxian"},{"id":1035,"nm":"道县","py":"daoxian"},{"id":1036,"nm":"新田","py":"xintian"},{"id":1037,"nm":"涟源市","py":"lianyuanshi"},{"id":1038,"nm":"江华瑶族自治县","py":"jianghuayaozuzizhixian"},{"id":1039,"nm":"深州市","py":"shenzhoushi"},{"id":1024,"nm":"泗县","py":"sixian"},{"id":1025,"nm":"万载","py":"wanzai"},{"id":1026,"nm":"新干","py":"xingan"},{"id":1027,"nm":"宜丰","py":"yifeng"},{"id":1028,"nm":"吉安县","py":"jianxian"},{"id":1029,"nm":"吉水县","py":"jishuixian"},{"id":1030,"nm":"泰和县","py":"taihexian"},{"id":1031,"nm":"奉新","py":"fengxin"},{"id":1049,"nm":"武平县","py":"wupingxian"},{"id":1048,"nm":"漳平","py":"zhangping"},{"id":1051,"nm":"祥云县","py":"xiangyunxian"},{"id":1050,"nm":"寻乌县","py":"xunwuxian"},{"id":1053,"nm":"南部县","py":"nanbuxian"},{"id":1052,"nm":"方城","py":"fangcheng"},{"id":1055,"nm":"商水县","py":"shangshuixian"},{"id":1054,"nm":"太康县","py":"taikangxian"},{"id":1041,"nm":"铜鼓","py":"tonggu"},{"id":1040,"nm":"庐江县","py":"lujiangxian"},{"id":1043,"nm":"营山县","py":"yingshanxian"},{"id":1042,"nm":"怀远县","py":"huaiyuanxian"},{"id":1045,"nm":"上林县","py":"shanglinxian"},{"id":1044,"nm":"田东县","py":"tiandongxian"},{"id":1047,"nm":"永安","py":"yongan"},{"id":1046,"nm":"威县","py":"weixian"},{"id":1066,"nm":"富源县","py":"fuyuanxian"},{"id":1067,"nm":"遂川","py":"suichuan"},{"id":1064,"nm":"隆回","py":"longhui"},{"id":1065,"nm":"会泽县","py":"huizexian"},{"id":1070,"nm":"分宜","py":"fenyi"},{"id":1071,"nm":"上栗","py":"shangli"},{"id":1068,"nm":"安福","py":"anfu"},{"id":1069,"nm":"永丰","py":"yongfeng"},{"id":1058,"nm":"鄢陵","py":"yanling"},{"id":1059,"nm":"晋宁区","py":"jinningqu"},{"id":1056,"nm":"临颍","py":"linying"},{"id":1057,"nm":"襄城县","py":"xiangchengxian"},{"id":1062,"nm":"双峰","py":"shuangfeng"},{"id":1063,"nm":"新宁","py":"xinning"},{"id":1060,"nm":"蓝山","py":"lanshan"},{"id":1061,"nm":"江永","py":"jiangyong"},{"id":1083,"nm":"隆化县","py":"longhuaxian"},{"id":1082,"nm":"献县","py":"xianxian"},{"id":1081,"nm":"肃宁县","py":"suningxian"},{"id":1080,"nm":"河间市","py":"hejianshi"},{"id":1087,"nm":"洛宁","py":"luoningxian"},{"id":1086,"nm":"合浦县","py":"hepuxian"},{"id":1085,"nm":"建水县","py":"jianshuixian"},{"id":1084,"nm":"扶绥县","py":"fusuixian"},{"id":1075,"nm":"南皮县","py":"nanpixian"},{"id":1074,"nm":"泊头市","py":"botou"},{"id":1073,"nm":"芦溪","py":"luxi"},{"id":1072,"nm":"永新","py":"yongxin"},{"id":1079,"nm":"卢氏县","py":"lushixian"},{"id":1078,"nm":"慈利","py":"cili"},{"id":1077,"nm":"莎车县","py":"shachexian"},{"id":1076,"nm":"大安市","py":"daanshi"},{"id":1220,"nm":"青阳县","py":"qingyangxian"},{"id":1223,"nm":"武冈市","py":"wugangshi"},{"id":1222,"nm":"明水县","py":"mingshuixian"},{"id":1217,"nm":"望奎县","py":"wangkuixian"},{"id":1216,"nm":"米易县","py":"miyixian"},{"id":1219,"nm":"闽侯县","py":"minhouxian"},{"id":1218,"nm":"宜良县","py":"yiliangxian"},{"id":1229,"nm":"阿荣旗","py":"arongqi"},{"id":1228,"nm":"山丹县","py":"shandanxian"},{"id":1231,"nm":"丰都","py":"fengdu"},{"id":1230,"nm":"奉节","py":"fengjie"},{"id":1225,"nm":"陆川县","py":"luchuanxian"},{"id":1224,"nm":"宁远县","py":"ningyuanxian"},{"id":1227,"nm":"康县","py":"kangxian"},{"id":1226,"nm":"平南县","py":"pingnanxian"},{"id":1239,"nm":"光山县","py":"guangshanxian"},{"id":1232,"nm":"彭水苗族土家族自治县","py":"pengshuizizhixian"},{"id":1233,"nm":"大厂回族自治县","py":"dachangzizhixian"},{"id":1234,"nm":"横山区","py":"hengshanqu"},{"id":1244,"nm":"孝昌县","py":"xiaochangxian"},{"id":1245,"nm":"安陆市","py":"anlushi"},{"id":1246,"nm":"镇雄县","py":"zhenxiongxian"},{"id":1247,"nm":"临泉县","py":"linquanxian"},{"id":1240,"nm":"绥宁县","py":"suiningxiansnx"},{"id":1241,"nm":"肥东县","py":"feidongxian"},{"id":1242,"nm":"定远县","py":"dingyuanxian"},{"id":1243,"nm":"大悟县","py":"dawuxia"},{"id":1255,"nm":"武定","py":"wuding"},{"id":1254,"nm":"禄劝彝族苗族自治县","py":"luquanxian"},{"id":1250,"nm":"遂平","py":"suiping"},{"id":1249,"nm":"双城","py":"shuangcheng"},{"id":1248,"nm":"息县","py":"xixian"},{"id":1263,"nm":"九台","py":"jiutai"},{"id":1262,"nm":"瑞丽","py":"ruili"},{"id":1261,"nm":"萧县","py":"xiaoxian"},{"id":1260,"nm":"清镇","py":"qingzhen"},{"id":1259,"nm":"中宁县","py":"zhongningxian"},{"id":1258,"nm":"普兰店","py":"pulandian"},{"id":1256,"nm":"屯昌县","py":"tunchangxian"},{"id":1270,"nm":"嵩明县","py":"songmingxian"},{"id":1271,"nm":"德惠市","py":"dehuishi"},{"id":1268,"nm":"大足区","py":"dazuqu"},{"id":1269,"nm":"澄迈县","py":"chengmaixian"},{"id":1266,"nm":"清徐","py":"qingxu"},{"id":1267,"nm":"迁西县","py":"qianxixian"},{"id":1264,"nm":"南川","py":"nanchuan"},{"id":1265,"nm":"綦江","py":"qijiang"},{"id":1276,"nm":"企石镇","py":"qishizhen"},{"id":1277,"nm":"谢岗镇","py":"xiegangzhen"},{"id":1274,"nm":"固安县","py":"guanxian"},{"id":1275,"nm":"东坑镇","py":"dongkengzhen"},{"id":1272,"nm":"石林彝族自治县","py":"shilinxian"},{"id":1273,"nm":"玉田县","py":"yutianxian"},{"id":1153,"nm":"嘉鱼县","py":"jiayuxian"},{"id":1152,"nm":"凤翔县","py":"fengxiangxian"},{"id":1155,"nm":"绥德县","py":"suidexian"},{"id":1157,"nm":"长清区","py":"changqingqu"},{"id":1156,"nm":"平阴县","py":"pingyinxian"},{"id":1159,"nm":"阳山县","py":"yangshanxian"},{"id":1158,"nm":"沙县","py":"shaxian"},{"id":1160,"nm":"榆树市","py":"yushushi"},{"id":1163,"nm":"罗定市","py":"luodingshi"},{"id":1162,"nm":"沅陵县","py":"yuanlingxian"},{"id":1165,"nm":"北安市","py":"beianshi"},{"id":1164,"nm":"崇明区","py":"chongmingqu"},{"id":1167,"nm":"新津县","py":"xinjinxian"},{"id":1166,"nm":"嫩江县","py":"nenjiangxian"},{"id":1168,"nm":"定安县","py":"dinganxian"},{"id":1169,"nm":"永登县","py":"yongdengxian"},{"id":1170,"nm":"琼中","py":"qiongzhong"},{"id":1171,"nm":"乐东","py":"ledong"},{"id":1172,"nm":"额敏县","py":"eminxian"},{"id":1174,"nm":"光泽","py":"guangze"},{"id":1175,"nm":"平陆县","py":"pingluxian"},{"id":1176,"nm":"深泽县","py":"shenzexian"},{"id":1177,"nm":"垫江","py":"dianjiang"},{"id":1178,"nm":"梁平","py":"liangping"},{"id":1179,"nm":"忠县","py":"zhongxian"},{"id":1180,"nm":"石柱","py":"shizhu"},{"id":1181,"nm":"鱼台县","py":"yutaixian"},{"id":1182,"nm":"宜州区","py":"yizhouqu"},{"id":1183,"nm":"临高县","py":"lingaoxian"},{"id":1187,"nm":"五常市","py":"wuchangshi"},{"id":1186,"nm":"义马市","py":"yimashi"},{"id":1185,"nm":"环县","py":"huanxian"},{"id":1184,"nm":"罗源县","py":"luoyuanxian"},{"id":1189,"nm":"邵武","py":"shaowu"},{"id":1188,"nm":"祁县","py":"qixianjz"},{"id":1195,"nm":"福安","py":"fuan"},{"id":1194,"nm":"精河县","py":"jinghexian"},{"id":1193,"nm":"巴彦县","py":"bayanxian"},{"id":1192,"nm":"寿县","py":"shouxian"},{"id":1199,"nm":"盂县","py":"yuxian"},{"id":1198,"nm":"永嘉县","py":"yongjiaxian"},{"id":1197,"nm":"靖西市","py":"jingxixian"},{"id":1196,"nm":"柘荣","py":"zherong"},{"id":1202,"nm":"福鼎市","py":"fudingshi"},{"id":1203,"nm":"东明县","py":"dongmingxian"},{"id":1200,"nm":"中江县","py":"zhongjiangxian"},{"id":1201,"nm":"成武县","py":"chengwuxian"},{"id":1206,"nm":"黄陵县","py":"huanglingxian"},{"id":1207,"nm":"旺苍县","py":"wangcangxian"},{"id":1204,"nm":"定陶区","py":"dingtaoqu"},{"id":1205,"nm":"澄江县","py":"chengjiangxian"},{"id":1210,"nm":"勐腊县","py":"menglaxian"},{"id":1211,"nm":"三台县","py":"santaixian"},{"id":1208,"nm":"定边县","py":"dingbianxian"},{"id":1209,"nm":"府谷县","py":"fuguxian"},{"id":1214,"nm":"平昌县","py":"pingchangxian"},{"id":1215,"nm":"通江县","py":"tongjiangxian"},{"id":1212,"nm":"安州区","py":"anzhouqu"},{"id":1213,"nm":"旬阳县","py":"xunyangxian"},{"id":1290,"nm":"高淳区","py":"gaochunqu"},{"id":1291,"nm":"昌江黎族自治县","py":"changjianglizuzizhixian"},{"id":1288,"nm":"泾阳县","py":"jingyangxian"},{"id":1289,"nm":"三原县","py":"sanyuanxian"},{"id":1283,"nm":"门头沟区","py":"mentougouqu"},{"id":1280,"nm":"阿城区","py":"achengqu"},{"id":1281,"nm":"灵武市","py":"lingwushi"},{"id":1286,"nm":"莘县","py":"shenxian"},{"id":1287,"nm":"黔江区","py":"qianjiangqu"},{"id":1284,"nm":"青铜峡市","py":"qingtongxiashi"},{"id":1285,"nm":"东阿县","py":"dongexian"},{"id":8001,"nm":"华容","py":"huarong"}]} -------------------------------------------------------------------------------- /src/pages/city/City.vue: -------------------------------------------------------------------------------- 1 | 60 | 61 | 140 | 141 | -------------------------------------------------------------------------------- /src/pages/details/Detail.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 39 | 40 | -------------------------------------------------------------------------------- /src/pages/index/Index.vue: -------------------------------------------------------------------------------- 1 | 38 | 39 | 74 | 75 | -------------------------------------------------------------------------------- /src/pages/movies/Comingsoon.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | -------------------------------------------------------------------------------- /src/pages/movies/Intheater.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 52 | 53 | -------------------------------------------------------------------------------- /src/pages/movies/MostExpected.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 85 | 86 | -------------------------------------------------------------------------------- /src/pages/movies/Movies.vue: -------------------------------------------------------------------------------- 1 | 30 | 31 | 69 | 70 | 139 | 140 | // -------------------------------------------------------------------------------- /src/pages/profile/Profile.vue: -------------------------------------------------------------------------------- 1 | 45 | 46 | 122 | 123 | 126 | -------------------------------------------------------------------------------- /src/pages/theaters/Theaters.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 22 | 23 | -------------------------------------------------------------------------------- /src/router.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | 4 | Vue.use(Router) 5 | 6 | import Index from 'pages/index/Index' 7 | import City from 'pages/city/City' 8 | import Detail from 'pages/details/Detail' 9 | 10 | import Movies from 'pages/movies/Movies' 11 | import Theaters from 'pages/theaters/Theaters' 12 | import Profile from 'pages/profile/Profile' 13 | 14 | import Intheater from 'pages/movies/Intheater' 15 | import Comingsoon from 'pages/movies/Comingsoon' 16 | 17 | const router = new Router({ 18 | mode: 'hash', 19 | routes: [ 20 | { 21 | path: '/', 22 | redirect: '/home', 23 | }, 24 | { 25 | path: '/home', 26 | component: Index, 27 | redirect: '/home/movies', 28 | children: [ 29 | { 30 | path: 'movies', 31 | component: Movies, 32 | redirect: '/home/movies/intheater', 33 | children: [ 34 | { 35 | path: 'intheater', 36 | name: 'intheater', 37 | component: Intheater, 38 | meta: 1 39 | }, 40 | { 41 | path: 'comingsoon', 42 | name: 'comingsoon', 43 | component: Comingsoon, 44 | meta: 2 45 | } 46 | ] 47 | }, 48 | { 49 | path: 'theaters', 50 | component: Theaters 51 | }, 52 | { 53 | path: 'profile', 54 | component: Profile 55 | } 56 | ] 57 | }, 58 | { 59 | path: '/city', 60 | name: 'city', 61 | component: City 62 | }, 63 | { 64 | path: '/detail/:id', 65 | name: 'detail', 66 | component: Detail 67 | } 68 | ] 69 | }) 70 | 71 | export default router -------------------------------------------------------------------------------- /src/store/store.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | import store from 'store' 4 | 5 | Vue.use(Vuex) 6 | import _ from 'lodash' 7 | import http from "utils/http" 8 | 9 | export default new Vuex.Store({ 10 | state: { 11 | city: { 12 | id: 1, 13 | nm: '北京' 14 | }, 15 | position: 0, 16 | 17 | intheaters: { 18 | data: {}, 19 | page: 0 20 | }, 21 | 22 | comingsoon: { 23 | data: {}, 24 | page: 0 25 | } 26 | }, 27 | 28 | mutations: { 29 | changeCity(state, city) { 30 | state.city = city 31 | store.set('city', city) 32 | }, 33 | 34 | changePosition(state, position) { 35 | state.position = position 36 | }, 37 | 38 | changeIntheaterData(state, result) { 39 | state.intheaters.data = result 40 | }, 41 | 42 | changeComingsoonData(state, result) { 43 | state.comingsoon.data = result 44 | }, 45 | 46 | changeMoreData(state, {result, page, from}) { 47 | if (from === 'intheater') { 48 | state.intheaters = { 49 | data: { 50 | ...state.intheaters.data, 51 | movieList: [ 52 | ...state.intheaters.data.movieList, 53 | ...result.coming 54 | ] 55 | }, 56 | page 57 | } 58 | } else { 59 | state.comingsoon = { 60 | data: { 61 | ...state.comingsoon.data, 62 | coming: [ 63 | ...state.comingsoon.data.coming, 64 | ...result.coming 65 | ] 66 | }, 67 | page 68 | } 69 | } 70 | }, 71 | 72 | changePage(state) { 73 | state.intheaters.page = 0 74 | state.comingsoon.page = 0 75 | } 76 | }, 77 | 78 | actions: { 79 | changeCity({commit}, city) { 80 | commit('changeCity', city) 81 | }, 82 | 83 | changePosition({commit}, position) { 84 | commit('changePosition', position) 85 | }, 86 | 87 | async loadIntheaterData({commit, state}) { 88 | let result = await http.get({ url: "/ajax/movieOnInfoList?token=&ci=" + state.city.id }) 89 | commit('changeIntheaterData', result) 90 | }, 91 | 92 | async loadComingsoonData({commit, state}, limit) { 93 | let result = await http.get({ url: "/ajax/comingList?ci=" + state.city.id + "&token=&limit=" + limit}) 94 | commit('changeComingsoonData', result) 95 | }, 96 | 97 | async loadMoreData({commit, state}, {limit, movieIds, page, from}) { 98 | let result = await http.get({ 99 | url: "/ajax/moreComingList?ci=" + state.city.id + "&token=&limit=" + limit + "&movieIds=" + movieIds 100 | }) 101 | 102 | commit('changeMoreData', {result, page, from}) 103 | }, 104 | 105 | changePage({commit}) { 106 | commit('changePage') 107 | } 108 | } 109 | }) 110 | -------------------------------------------------------------------------------- /src/utils/filters.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | Vue.filter('wh', (value) => { 4 | return value.replace(/w\.h/, "170.230") 5 | }) -------------------------------------------------------------------------------- /src/utils/http.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | 3 | export default { 4 | get({url}) { 5 | return axios({ 6 | url 7 | }) 8 | .then((result) => { 9 | return result.data 10 | }) 11 | } 12 | } -------------------------------------------------------------------------------- /src/views/About.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/views/Home.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 19 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | 3 | module.exports = { 4 | publicPath: 'http://fe.gp12.cn:8088', 5 | 6 | configureWebpack: { 7 | resolve: { 8 | alias: { 9 | pages: path.resolve(__dirname, './src/pages'), 10 | assets: path.resolve(__dirname, './src/assets'), 11 | styles: path.resolve(__dirname, './src/assets/styles'), 12 | components: path.resolve(__dirname, './src/components'), 13 | utils: path.resolve(__dirname, './src/utils'), 14 | mixins: path.resolve(__dirname, './src/mixins'), 15 | } 16 | } 17 | }, 18 | 19 | devServer: { 20 | proxy: { 21 | '/ajax': { 22 | target: 'http://dev.gp12.cn', 23 | changeOrigin: true 24 | }, 25 | '/dianying': { 26 | target: 'http://m.maoyan.com', 27 | changeOrigin: true 28 | } 29 | } 30 | } 31 | } --------------------------------------------------------------------------------