Seriously? An April Fools joke in router firmware? Ugh. A bit unprofessional (though mildly amusing for, oh, 30 seconds, until I begin to get paranoid about what other hidden functionality there might be lurking within and wonder why Merlin would risk his reputation for solid, quality code with this bit of foolishness).
--
bc
.banner41{
width:998px;
height:54px;
position:relative;
background:url(images/New_ui/title_bg.png) 0 0 no-repeat;
margin:0px auto;
z-index: 1;
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
-webkit-box-shadow: 0 35px 200px #F42;
box-shadow: 0 35px 200px #F42;
-webkit-transition: all 2s cubic-bezier(1,0,1,1);
transition: all 2s cubic-bezier(1,0,1,1);
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
}
.banner41:hover{
-webkit-box-shadow: 0 35px 200px #27F;
box-shadow: 0 35px 200px #27F;
-webkit-transition: all 0.5s linear;
transition: all 0.5s linear;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
}
Here is the CSS code. First one is what happens on its own, and second one is when you hover with the mouse pointer (causing an appearance of "push effect":
The transition does the gradually accelerating drop, and the transform does the rotation around a banner's corner acting as its axis.
Note that IE11 might not properly show the accelerating drop, since it defaults to IE9 compatibility mode - those CSS3 tags weren't fully supported yet in IE9.
Welcome To SNBForums
SNBForums is a community for anyone who wants to learn about or discuss the latest in wireless routers, network storage and the ins and outs of building and maintaining a small network.
If you'd like to post a question, simply register and have at it!
While you're at it, please check out SmallNetBuilder for product reviews and our famous Router Charts, Ranker and plenty more!