校园APP小程序H5，免费源码，允许二开。

点击查看免费完整源码，允许二开

50% {

transform: scale(0.3);

-webkit-transform: scale(0.3);

opacity: 0.3;

}

75% {

transform: scale(0.5);

-webkit-transform: scale(0.5);

opacity: 0.5;

}

100% {

transform: scale(0.8);

-webkit-transform: scale(0.8);

opacity: 0.0;

}

}

.container {

position: relative;

width: 96px;

height: 96px;

/*border: 1px solid #000; hovertree.com */

}

/* 保持大小不变的小圆圈 何问起 */

.dot {

position: absolute;

width: 92px;

height: 92px;

//left: -2.5px;

    //top: -2.5px;

-webkit-border-radius: 50%;

-moz-border-radius: 50%;

//border: 2px solid red;

border-radius: 50%;

z-index: 2;

animation: msClock 1.8s linear infinite; 

}

@keyframes msClock{ 

0%,90%,100%{ transform: rotate(0) scale(1);}

20%,40%{ transform: rotate(-15deg) scale(1.1);}

30%,50%{ transform: rotate(15deg) scale(1.1);}

}

/* 产生动画（向外扩散变大）的圆圈  */

.pulse {

position: absolute;

width: 320px;

height: 320px;

    left: -120px;

    top: -120px;

border: 6px solid $dating-color-primary;

-webkit-border-radius: 50%;

-moz-border-radius: 50%;

border-radius: 50%;

z-index: 1;

opacity: 0;

-webkit-animation: warn 2s ease-out;

-moz-animation: warn 2s ease-out;

animation: warn 2s ease-out;

-webkit-animation-iteration-count: infinite;

-moz-animation-iteration-count: infinite;

animation-iteration-count: infinite;

box-shadow: 1px 1px 30px $dating-color-primary;

}

.pulse1 {

position: absolute;

width: 320px;

height: 320px;

    left: -120px;

    top: -120px;

border: 6px solid $dating-color-primary;

-webkit-border-radius: 50%;

-moz-border-radius: 50%;

border-radius: 50%;

z-index: 1;

opacity: 0;

-webkit-animation: warn1 2s ease-out;

-moz-animation: warn1 2s ease-out;

animation: warn1 2s ease-out;

-webkit-animation-iteration-count: infinite;

-moz-animation-iteration-count: infinite;

animation-iteration-count: infinite;

box-shadow: 1px 1px 30px $dating-color-primary;

}

a{color:blue;text-decoration:none;}

.match-button{

position: fixed;

bottom: calc(var(--status-bar-height) + 120rpx);

}

.prize-flying{

z-index:99;

width:100px;

position:absolute;

bottom:50%;

left:50%;

-webkit-transform:translateX(-50%);

transform:translateX(-50%)

}

.prize-flying .fly-prize {

text-align:center;

position:absolute;

top:100%;