.banner { width: 100%; /*padding-top: 50px;*/ } .banner img { width: 100%; } .blue-slide { } .red-slide { } .orange-slide { } .swiper-slide { color: #fff; text-align: center; } .banner .swiper-slide-active img { -webkit-animation: tada ; -moz-animation: tada ; } .product_list .home-tuan-list img { width: 90px; height: 66px; margin-top: 7px; margin-bottom: 5px; border-radius: 3px; } .info span i { background: url(../images/ddi_03.png); background-size: 20px 25px; margin-top: -5px; display: block; width: 20px; height: 25px; } @-webkit-keyframes tada { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-300%, 0, 0); transform: translate3d(-300%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-300%, 0, 0); transform: translate3d(-300%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(300%, 0, 0); transform: translate3d(300%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(300%, 0, 0); transform: translate3d(300%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { 0%, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } .bounceInLeft { } @-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } .index-category .swiper-container { height: 193px; } .herder_top { position: fixed; width: 100%; left: 0; top: 0; } .index-category .icon_list .item .icon { border-radius: 0; -webkit-border-radius: 0; } .index-category .icon_list .item .icon { background-size: 44px 44px; } .index-category .icon_list .yiyuan .icon { background: url(../images/icon1_03.png); background-size: 44px 44px; } .index-category .icon_list .kanjia .icon { background: url(../images/icon1_40.png); background-size: 44px 44px; } .index-category .icon_list .miaosha .icon { background: url(../images/icon1_05.png); background-size: 44px 44px; } .index-category .icon_list .jiangjia .icon { background: url(../images/icon1_07.png); background-size: 44px 44px; } .index-category .icon_list .waimai .icon { background: url(../images/icon1_09.png); background-size: 44px 44px; } .index-category .icon_list .dianpu .icon { background: url(../images/icon1_37.png); background-size: 44px 44px; } .index-category .icon_list .zongchou .icon { background: url(../images/icon1_38.png); background-size: 44px 44px; } .index-category .icon_list .qita .icon { background: url(../images/icon1_41.png); background-size: 44px 44px; } .index-category .icon_tab .item .icon { border-radius: 0; -webkit-border-radius: 0; } .index-category .icon_tab .item .icon { background-size: 44px 44px; } .index-category .icon_tab .food .icon { background: url(../images/icon2_24.png); background-size: 44px 44px; } .index-category .icon_tab .fun .icon { background: url(../images/icon2_27.png); background-size: 44px 44px; } .index-category .icon_tab .massage .icon { background: url(../images/icon2_29.png); background-size: 44px 44px; } .index-category .icon_tab .snack .icon { background: url(../images/icon2_31.png); background-size: 44px 44px; } .index-category .icon_tab .tuan .icon { background: url(../images/icon2_37.png); background-size: 44px 44px; } .index-category .icon_tab .movie .icon { background: url(../images/icon2_38.png); background-size: 44px 44px; } .index-category .icon_tab .hotel .icon { background: url(../images/icon2_39.png); background-size: 44px 44px; } .index-category .icon_tab .takeaway .icon { background: url(../images/icon2_40.png); background-size: 44px 44px; } .index-category .icon img { width: 44px; height: 44px; } .index-rec .title_list { padding-left: 0; height: 30px; line-height: 30px; color: #666; font-size: 13px; } .index-category .swiper-container { } .title_tab { width: 100%; line-height: 35px; text-align: center; position:absolute; }