
See Animation for hover : http://www.sympletech.com/tests/10orless.html
——————————————————————————————
#box{
-moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;
background: #cd61e4; background: -moz-linear-gradient(100% 100% 90deg, #cd61e4, #d9c0de); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cd61e4), to(#d9c0de)); background: -webkit-linear-gradient(#cd61e4, #d9c0de); background: -o-linear-gradient(#cd61e4, #d9c0de);
-moz-box-shadow: 6px 5px 3px hsla(0,0%,0%,.2); -webkit-box-shadow: 6px 5px 3px hsla(0,0%,0%,.2); box-shadow:6px 5px 3px hsla(0,0%,0%,.2);
padding:100px;
float:left;
}
#text:before{
content : ‘Made In’;
}
#text{
text-shadow: 2px 3px 5px #000;
}
#text, #box:hover{
opacity:0.50;-ms-filter:”progid:DXImageTransform.Microsoft.Alpha(opacity=50)”;filter:alpha(opacity=50);zoom:1;
}
#box:hover{
cursor:pointer;
-webkit-transition: all 1000ms ease; -moz-transition: all 1000ms ease; -o-transition:all 1000ms ease; transition:all 1000ms ease;
}
Notes
-
tmblrmailfor likes this
-
Daniel Lewis submitted this to 10lines