CSS3 გარდამავალი გენერატორი

გლუვი გადასვლის გამჭვირვალობა

პოპულარული წინასწარ დაყენებული პარამეტრები

გაქრობის ეფექტი

გლუვი გადასვლის გამჭვირვალობა

მასშტაბის ეფექტი

ელემენტის ზომის შეცვლა მაუსის გადატარებისას

როტაციის ეფექტი

ელემენტის შეტრიალება მაუსის გადატარებისას

სლაიდის ეფექტი

ელემენტის პოზიციის გადატანა

ფერის შეცვლა

ფონის ფერის გადასვლა

გადასვლების შესახებ

CSS გადასვლები საშუალებას გაძლევთ შეუფერხებლად შეცვალოთ თვისებების მნიშვნელობები მოცემული ხანგრძლივობის განმავლობაში.

ხშირად ანიმაციური თვისებები მოიცავს:

  • სიგანე, სიმაღლე
  • ზღვარი, შევსება
  • გამჭვირვალობა, ფერი
  • transform (scale, rotate, translate)
  • background-color

პროფესიონალის რჩევა: ყველა ცვლილების ანიმაციისთვის გამოიყენეთ „ყველა თვისების“ ოფცია.

Preview

HOVER ME

გენერირებული კოდი

.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; }  .element:hover { /* Hover styles will be generated here */ }

გადასვლის კონტროლი

300
0

მაუსის გადატარების ეფექტები

100%
100%
0px
0px
8px
8px

Related Tools