jquery - How would you achieve this 3d hover effect? -
i'm trying 3d mouseover effect when you're on div. here's it's now
i know how make in sort lower-left , top-right corner have cleaner shadow, oblique style. thought maybe load triangle on corners know if there's other way achieve that.
thanks
if don't mind using pseudo-elements, there's ::before
, ::after
(although note that, recall, ie doesn't recognise double-colon declaration, you'd have use :before
, :after
):
#box::before { content: ' '; position: absolute; top: -10px; left: -10px; bottom: 0; height: 100%; background-color: #f90; border-bottom: 10px solid white; border-right: 10px solid black; } #box::after { content: ' '; position: absolute; top: -10px; left: -10px; right: 0; width: 100%; border-bottom: 10px solid black; border-right: 10px solid white; }
Comments
Post a Comment