...

آموزش افکت زوم و محو شدن در هاور المنتور

در این ویدیو از آکادمی تیچرنت، یاد می‌گیرید که چگونه با استفاده از کدهای CSS و JavaScript یک افکت حرفه‌ای زوم و بلور (محو شدن) را هنگام هاور روی تصاویر یا بخش‌های دلخواه در المنتور ایجاد کنید. این تکنیک می‌تواند ظاهر سایت شما را جذاب‌تر و حرفه‌ای‌تر کند و تجربه کاربری بهتری را برای بازدیدکنندگان فراهم آورد.

کد استفاده شده در آموزش افکت زوم و محو شدن در هاور المنتور

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script>       var $ = jQuery $(document).ready(function(){       $('.card-focus').hover(function(){     $('.card-focus').addClass('blur')     $(this).removeClass('blur') }, function(){     $('.card-focus').removeClass('blur') }) }) </script>  <style> .card-focus{     transition: all 0.3s ease-in-out; } .card-focus.blur{     filter: blur(13px) grayscale(0.6);     transform: scale(0.95); } .card-focus:hover{     transform: scale(1.05); } .card-focus .e-container, .card-focus .e-con{     box-shadow: 0 10px 60px rgb(0 0 0 / 25%); } .card-focus .elementor-widget{     transition: all 0.3s ease-in-out; } .card-focus.blur .elementor-widget{     opacity: 0; } </style>

مدرس: امیر آزادمنش

زمان: 08:10 دقیقه

مشاهده در یوتیوب

مشاهده در آپارات

بفرست برای دوستت:
Seraphinite AcceleratorOptimized by Seraphinite Accelerator
Turns on site high speed to be attractive for people and search engines.