我的公用代码

.flex-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.flex-1 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.flex-column {
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-wrap {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.flex-wrap-center {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.flex-align-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.flex-align-end {
    -webkit-box-align: flex-end;
    -webkit-align-items: flex-end;
    -ms-flex-align: flex-end;
    align-items: flex-end;
}

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;


    -webkit-box-orient: vertical;
    box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    display: -webkit-box;

/*正面飞入*/
.scaleCenterIn{
	-webkit-animation-name:scaleInCenter !important;
	animation-name:scaleInCenter !important;
}
@-webkit-keyframes scaleInCenter{
	0%{-webkit-transform:scale(20);opacity: 0}
	100%{-webkit-transform:scale(1);opacity: 1}
}
@keyframes scaleInCenter{
	0%{transform:scale(20);opacity: 0}
	100%{transform:scale(1);opacity: 1}
}

	/*抖动*/
@-moz-keyframes tada{
  0%{-moz-transform:scale(1);}
  10%,20%{-moz-transform:scale(0.9) rotate(-3deg);}
  30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg);}
  40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg);}
  100%{-moz-transform:scale(1) rotate(0);}
 }

@-webkit-keyframes tada{
  0%{-webkit-transform:scale(1);}
  10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);}
  30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);}
  40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);}
  100%{-webkit-transform:scale(1) rotate(0);}
  }
  
  
  
  
@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale3d(1,1,1);
		transform: scale3d(1,1,1)
	}

	50% {
		-webkit-transform: scale3d(1.05,1.05,1.05);
		transform: scale3d(1.05,1.05,1.05)
	}

	100% {
		-webkit-transform: scale3d(1,1,1);
		transform: scale3d(1,1,1)
	}
}

@keyframes pulse {
	0% {
		-webkit-transform: scale3d(1,1,1);
		-ms-transform: scale3d(1,1,1);
		transform: scale3d(1,1,1)
	}

	50% {
		-webkit-transform: scale3d(1.05,1.05,1.05);
		-ms-transform: scale3d(1.05,1.05,1.05);
		transform: scale3d(1.05,1.05,1.05)
	}

	100% {
		-webkit-transform: scale3d(1,1,1);
		-ms-transform: scale3d(1,1,1);
		transform: scale3d(1,1,1)
	}
}


@-webkit-keyframes bounce {
	0%,100%,20%,53%,80% {
		-webkit-transition-timing-function: cubic-bezier(0.215,.61,.355,1);
		transition-timing-function: cubic-bezier(0.215,.61,.355,1);
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}

	40%,43% {
		-webkit-transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		-webkit-transform: translate3d(0,-30px,0);
		transform: translate3d(0,-30px,0)
	}

	70% {
		-webkit-transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		-webkit-transform: translate3d(0,-15px,0);
		transform: translate3d(0,-15px,0)
	}

	90% {
		-webkit-transform: translate3d(0,-4px,0);
		transform: translate3d(0,-4px,0)
	}
}

@keyframes bounce {
	0%,100%,20%,53%,80% {
		-webkit-transition-timing-function: cubic-bezier(0.215,.61,.355,1);
		transition-timing-function: cubic-bezier(0.215,.61,.355,1);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}

	40%,43% {
		-webkit-transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		-webkit-transform: translate3d(0,-30px,0);
		-ms-transform: translate3d(0,-30px,0);
		transform: translate3d(0,-30px,0)
	}

	70% {
		-webkit-transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		transition-timing-function: cubic-bezier(0.755,.050,.855,.060);
		-webkit-transform: translate3d(0,-15px,0);
		-ms-transform: translate3d(0,-15px,0);
		transform: translate3d(0,-15px,0)
	}

	90% {
		-webkit-transform: translate3d(0,-4px,0);
		-ms-transform: translate3d(0,-4px,0);
		transform: translate3d(0,-4px,0)
	}
}

//心跳动画

@-webkit-keyframes mybig /*Safari and Chrome*/
{
	0%{
		transform:scale(1);
		-webkit-transform:scale(1);
	}
	15%{
		transform:scale(1.2);
		-webkit-transform:scale(1.2);
	}
	35%{
		transform:scale(1);
		-webkit-transform:scale(1);
	}
	70%{
		transform:scale(1);
		-webkit-transform:scale(1);
	}
	85%{
		transform:scale(1.2);
		-webkit-transform:scale(1.2);
		
	}
	100%{
		transform:scale(1);
		-webkit-transform:scale(1);
	}
}

动态加载
function loadScript(url, callback) {
  var script = document.createElement("script");
  script.type = "text/javascript";
  if(typeof(callback) != "undefined"){
    if (script.readyState) {
      script.onreadystatechange = function () {
        if (script.readyState == "loaded" || script.readyState == "complete") {
          script.onreadystatechange = null;
          callback();
        }
      };
    } else {
      script.onload = function () {
        callback();
      };
    }
  }
  script.src = url;
  document.body.appendChild(script);
}

 jQuery.getScript("#",{
})