Нужно выбрать анимацию
 

снова тот же вопрос анимация другая
http://jsfiddle.net/7K7mb/2/
http://jsfiddle.net/WtgF3/2/

4 самая прикольная, 3 самая понятная, 1 самая непонятная, 2 как будто недоделана.

3 вариант мне понравился больше всех :victory:

Еще один нюанс, таких блоков будет 5+ на странице стоит ли использовать анимацию ?
Тут вопрос и производительность и внешнего вида

к примеру так http://codepen.io/cyberua/full/rlbxD

Кроме первой остальные очень даже вполне. А первая не вызывает ассоциаций с загрузкой контента.
Попробовал на слабом ноуте последний пример - производительность не страдает, вроде. Внешний вид - хорошо.

Возможно 3 подойдет все таки больше для картинок. Хотя 4 все-таки апофеозней ;)

какая анимация при наведение лучше (only chrome edition)
http://jsfiddle.net/CyBer_UA/7K7mb/1/
http://jsfiddle.net/CyBer_UA/WtgF3/1/

Мне кажется у них разное назначение

показать текст и кнопку при наведение на картинку.

Слабо убрать префикс, чтобы в FF посмотреть? Обязательно писать бред Только Хром?!

Gozar, я пишу по сути что бы сравнить и сравниваю в хроме,а transform не работает без префикса в хроме

Ууу, не знал. Это они облажались. Давно пора убрать префикс. Однако это не ответ, почему нет просто transform

http://jsfiddle.net/7K7mb/2/
http://jsfiddle.net/WtgF3/2/

Берешь так типа и на:

http://jsfiddle.net/7K7mb/4/
http://jsfiddle.net/WtgF3/3/


О, а ты догадливый :)

Есть такая мегаштука, называется препроцессоры CSS. Там можно использовать функции. Stylus точно может, рекомендую.

Ты в нем пишешь:

transform translateY(0px)

А он тебе это конвертит по твоей функции в

-webkit-transform: translateY(0px);
transform: translateY(0px);

Андрейстенд?

Gozar, да ладно?
второй пример был сделан через ctrl + c, ctrl + v

реги, саморазвитие, практика, не?!

1 - страшно непонятно, что происходит с анимацией
2 - не окружность. Овальчик :)
3 - почти "да". я выбрал его
4 - андроид ... для картинок не подойдёт

Лично я бы выбрал спиннер с IOS. Легко узнаётся

melky, у меня снова вопрос какая анимация лучше и поэтому что бы не создавать тему, я кинул вопрос сюда
http://jsfiddle.net/7K7mb/2/
http://jsfiddle.net/WtgF3/2/

А по каким параметрам ты выбираешь лучшую? Та, что быстрее, или красивее, или юзабельнее?

красота как то не самая важно(в данном случае:))

тогда никакая ;) про первую - мелкий кусок инфы снизу; про вторую - мелькают как бесы, слишком много действий.

а что, если кнопку "more" поместить в тексте, добавить delay перед анимацией и сделать появление заголовка мгновенным?

melky, а так http://jsfiddle.net/7K7mb/5/ ?

http://jsfiddle.net/WtgF3/4/ ?

Только ещё бы задержку перед стартом анимации при наводе курсора.

melky, спс за вариант, еще по экспериментирую.

Красивше будет если белые буквы будут выезжать из под черной полосы, а не просто резко появляться

Заголовок?

HOVER STYLE

Не понял, а что изменилось? Буквы как появлялись резко, так и появляются, "из под" черной полосы они тоже не выезжают.

Gozar, как они должны выежать?

заголовок выезжает из черной полоски вверх, а описание выезжает из под черной полоски вниз

выглядит неплохо, но верстать заново придётся. тут не прокатит "CTRL+C/V" :lol:

да сделать то можно, но вопрос в том нужно ли?)

Зачем тебе анимация? Зачем ты создал эту тему?

что бы спросить какой из вариантов больше подходит.

...
repeat 100

я кажется нашел подходящую анимацию http://codepen.io/anon/pen/bCHvB

всем спасибо, решил.
http://codepen.io/anon/pen/bCHvB