小特效-css高光效果

.spring_footer .light {
    cursor: pointer;
    position: absolute;
    left: -1180px;
    top: 0;
    width: 1240px;
    height: 90px;
    background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
    background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
    transform: skewx(-25deg);
    -o-transform: skewx(-25deg);
    -moz-transform: skewx(-25deg);
    -webkit-transform: skewx(-25deg);
}
.spring_footer:hover .light {
    left: 1180px;
    -moz-transition: 2s;
    -o-transition: 2s;
    -webkit-transition: 2s;
    transition: 2s;
}

light在結構層中屬於光亮層，請包裹在具有relative定位以及overflow：hidden的容器內；具體角度以及長度依據需要調整transform以及偏移量。