채택완료

하얀 배경을 그라디언트 배경으로 호버 질문입니다!

Copy
.s3_card_navbox{

  width: 25%;

  height: 160px;

  padding: 0 30px;

  background: #fff;

  background: -moz-linear-gradient(45deg, #fff 0%, #fff 100%); /* FF3.6-15 */

  background: -webkit-linear-gradient(45deg, #fff 0%,#fff 100%); /* Chrome10-25,Safari5.1-6 */

  background: -o-linear-gradient(45deg, #fff 0%,#fff 100%);

  background: linear-gradient(45deg, #fff 0%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#fff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

  -webkit-box-shadow: 0px 0px 10px rgba(51, 60, 64, 0.58);

  -moz-box-shadow:    0px 0px 10px rgba(51, 60, 64, 0.58);

  -o-box-shadow:    0px 0px 10px rgba(51, 60, 64, 0.58);

  box-shadow:         0px 0px 10px rgba(51, 60, 64, 0.58);

  position: relative;

  float: left;

  z-index: 2;

  top: 110px;

  transform: translateY(-50%);

  left: 25px;

  transition: all 0.5s;

}

.s3_card_navbox:hover{

  background: #89f7fe; /* Old browsers */

  background: -moz-linear-gradient(45deg, #89f7fe 0%, #66a6ff 100%); /* FF3.6-15 */

  background: -webkit-linear-gradient(45deg, #89f7fe 0%,#66a6ff 100%); /* Chrome10-25,Safari5.1-6 */

  background: -o-linear-gradient(45deg, #89f7fe 0%,#66a6ff 100%);

  background: linear-gradient(45deg, #89f7fe 0%,#66a6ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89f7fe', endColorstr='#66a6ff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

 }

 

코드를 이렇게 작성하였는데, transition 효과가 먹질 않네요

 

스크립트로 방법이있을까요?

|

답변 1개

채택된 답변
+20 포인트

jquery animate를 쓰는방법이 있습니다

답변을 작성하려면 로그인이 필요합니다.