Təmiz CSS-da 8 faydalı imkan: 2) İmage zoom on hover

Təmiz CSS-da 8 faydalı imkan: 2) İmage zoom on hover

Code-News
07.03.2019 PAYLAŞIM
TECHNOTE @technote TECHNOTE logo icon

Bənzər xəbər


#Step IT Academy tərəfindən təqdim olunur  





    CSS texnologiyasında 8 faydalı həllər barədə olan məqalə seriyasına davam edirik.

Öncəki hissə:

1) «Yapışqan» footer



2) İmage Zoom on Hover

    Belə effekt kliklənəbilən şəkilə fikir cəlb etmək üçün çox faydalıdır. İstifadəçi mouse-u şəkilin üzərinə gətirərkən, şəkil azca böyüyür, və üstəlik böyümə crope-vari effekt ilə baş verdiyi üçün şəkilin ümumi tutduğu yerin həcmində heç bir dəyişiklik baş vermir. 

    Effekti yaratmaq üçün bizə vrapper div lazımdır, hansınınla ki biz img teqini HTML-də əhatə etməliyik.

    Həmçinin effektin düzgün işləməsi üçün elementə  width və height verib,  overflow parametrini hidden olaraq təyin etmək lazımdır. Bundan sonra siz istənilən tip transformasiya istifadə edə bilərsiniz.


Qeyd: Şərhlərdə nalayiq ifadələr işlətmək, reklam xarakterli mətn paylaşmaq qadağandır.

Şərh yoxdur

Şərh yazmaq üçün daxil olun


DAHA ÇOX


2020-ci ildə məlumatların vizualizasiyası üçün aktual olacaq Top-8 JavaScript ki..

JavaScript-də məlumatları daha gözəl şəkildə təqdim etmək lazımdır?


Microsoft bu il olmuş qeyri adi fişinq kiberhücumlarından danışdı

Bir neçə müddət bundan öncə isə Microsoft şirkəti kiberhücumlar və malware-lar üzrə trendləri əks et..


Microsoft Windows-da 0-day boşluğu da daxil olmaqla 7 kritik sistem boşluğu arad..

Microsoft şirkəti bu ay təqdim etmiş olduğu yenilənmələr ilə öz sistemlərində 36 boşluğu aradan qald..


Microsoft Teams platformasının Linux versiyası təqdim edildi

Microsoft şirkəti Microsoft Teams platformasının Linux versiyasını təqdim edib.


OpenBSD-də 4 ciddi sistem boşluğu aşkar edilib

OpenBSD-də 4 ciddi sistem boşluğu aşkar edilərək aradan qaldrılıb.


Sadə tətbiqlərin müxtəlif proqramlaşdırma dillərindəki test nəticələri təqdim ed..

Assembler x86_64-də HeavyThing adlı azad kitabxananı reallaşdırmış müəllif Jeff Marrison “Assembler-..

×