22

✏️ Editing: ep-image-hover-effects.css

.bdt-image-hover-effect-wrap img{width:100%;height:100%;display:block;object-fit:cover;transition:all .5s ease}.bdt-image-hover-effect-wrap:hover img{transform:scale(1.1)}.bdt-image-hover-effect-wrap{overflow:hidden;position:relative}.bdt-image-hover-effect-wrap::before,.bdt-image-hover-effect-wrap::after{position:absolute;content:"";transition:all .5s ease}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-1::before,.bdt-image-hover-effect-wrap.bdt-image-hover-effect-1::after{z-index:3}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-1::before{top:50%;left:0;right:0;bottom:50%}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-1::after{top:0;left:50%;right:50%;bottom:0}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-1:hover:before{top:0;bottom:0}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-1:hover:after{left:0;right:0}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-2::after{left:50%;opacity:1;padding-top:100%;top:50%;transform:translate(-50%, -50%) rotate(45deg) scale(0);width:100%}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-2:hover::after{opacity:0;transform:translate(-50%, -50%) rotate(45deg) scale(1)}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-3::before,.bdt-image-hover-effect-wrap.bdt-image-hover-effect-3::after{bottom:20px;left:20px;opacity:0;right:20px;top:20px;z-index:1;background:unset !important}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-3::before{transform:scaleX(0);border-bottom:2px solid;border-top:2px solid}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-3::after{transform:scaleY(0);border-left:2px solid;border-right:2px solid}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-3:hover::before,.bdt-image-hover-effect-wrap.bdt-image-hover-effect-3:hover::after{opacity:1;filter:alpha(opacity=100);transform:scale(1)}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-4::before{top:0;left:50%;width:120%;height:100px;transition:all .6s linear;z-index:1;transform:scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translateY(-150%);backface-visibility:hidden;pointer-events:none}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-4:hover::before{transform:scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translateY(200%);left:-100%;top:100%}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-5::after{top:30px;right:50px;bottom:30px;left:50px;border-right:2px solid;border-left:2px solid;transform:scale(1, 0);transform-origin:100% 0;opacity:0;z-index:1}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-5::before{top:50px;right:30px;bottom:50px;left:30px;border-top:2px solid;border-bottom:2px solid;opacity:0;transform:scale(0, 1);transform-origin:0 0;z-index:1}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-5::after,.bdt-image-hover-effect-wrap.bdt-image-hover-effect-5::before{background:unset !important}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-5:hover::after,.bdt-image-hover-effect-wrap.bdt-image-hover-effect-5:hover::before{opacity:1;transform:scale(1)}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-6::after{top:30px;right:30px;bottom:30px;left:30px;border:1px solid;opacity:0;transform:scale(0);background:unset !important}.bdt-image-hover-effect-wrap.bdt-image-hover-effect-6:hover::after{opacity:1;transform:scale(1)}

MR SKB