Witam,
mam taki kod, ale kiedy po opuszczeniu diva przez mysz szerokość się zmniejsza, animacja się na chwilę zacina. Jak mogę temu zapobiec?
Nie jestem przekonany, czy rzeczywiście zacina się. Może to złudzenie, wynikające z szybszego usunięcia tekstu niż zmniejszenia szerokości kontenera?
UPDATE:
A nawet może nie chodzić o wizualny efekt, a o rzeczywiste zużycie przez przeglądarkę czasu na wyrenderowanie nowego tekstu.
Poza tym... Co prawda jeszcze nie umiem tego obsługiwać, ale skorzystałem z takiego narzędzia w Firefoksie o nazwie Performance. Z dokładnością do 5ms mogę powiedzieć (o ile nie pomyliłem się, bo, jak mówię, nie umiem), że animacja rozwijania trwała 2222ms - 1200ms = 1022ms, a animacja zwijania trwała 3823ms - 2800ms = 1023ms.
A czy na podstawie CCSa możesz wywnioskować, co tu jest nie tak, albo jak temu zapobiec?
Być może by się dało, czy ja umiem: nie wiem. Ale przecież napisałem, że uważam, że wszystko jest w porządku.
PS. Czy problem stanowi dla Ciebie szybsza zmiana szerokości wyświetlanego tekstu niż kontenera (tj. "nie-płynna")?
Usun ta czesc:
.produkt:hover .produktDaneModel{
}
Oraz dodaj do .produkt:hover
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;