Анимация

[Skanexis]

Как сделать такую анимация?

[Litesm]

ооо, круто! Я бы тоже хотел узнать, как такое сделать )

[Respected]

Изучайте css!

.cForumList .ipsDataItem {
	background:#272e48;
	float:left;
	width:100%;
	margin:0 auto 6px;
	padding:6px;
	border-radius:6px;
	border:1px solid #2e3655;
	-webkit-box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out
}

.cForumList .ipsDataItem:hover {
	z-index:10;
	-webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	-webkit-transform:scale(1);
	-moz-transform:scale(1.01);
	-o-transform:scale(1.01);
	transform:scale(1.01)
}

 

[Litesm]

В 23.10.2020 в 12:42, Respected сказал:

Изучайте css!

.cForumList .ipsDataItem {
	background:#272e48;
	float:left;
	width:100%;
	margin:0 auto 6px;
	padding:6px;
	border-radius:6px;
	border:1px solid #2e3655;
	-webkit-box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out
}

.cForumList .ipsDataItem:hover {
	z-index:10;
	-webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	-webkit-transform:scale(1);
	-moz-transform:scale(1.01);
	-o-transform:scale(1.01);
	transform:scale(1.01)
}

 

А куда его вставлять? Помогите, а то я вообще не разбираюсь ни в CSS ни в движке IPS

[roonovoorsk]

Litesm нужно вставлять custom.css

[Litesm]

Вставил код и у меня зажопилось всё. У меня стоит стандартный шаблон. Да, блоки анимируются но они стали темными

[roonovoorsk]

1 минуту назад, Litesm сказал:

Вставил код и у меня зажопилось всё. У меня стоит стандартный шаблон. Да, блоки анимируются но они стали темными

 

добавить только этот код

.cForumList .ipsDataItem:hover {
	z-index:10;
	-webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	-webkit-transform:scale(1);
	-moz-transform:scale(1.01);
	-o-transform:scale(1.01);
	transform:scale(1.01)
}

 

[Litesm]

4 минуты назад, roonovoorsk сказал:

добавить только этот код

.cForumList .ipsDataItem:hover {
	z-index:10;
	-webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	-webkit-transform:scale(1);
	-moz-transform:scale(1.01);
	-o-transform:scale(1.01);
	transform:scale(1.01)
}

 

сработало )) спасибо! 

[SlawkA]

Litesm можно поставить такой код. скомбинировать оба кода в один. и оно плавней будет работать.

Спойлер

.cForumList .ipsDataItem:hover {
	z-index:10;
	-webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	-webkit-transform:scale(1);
	-moz-transform:scale(1.01);
	-o-transform:scale(1.01);
	transform:scale(1.01)
      
      -webkit-box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out    
}

 

 

[Litesm]

2 минуты назад, SlawkA сказал:

Litesm можно поставить такой код. скомбинировать оба кода в один. и оно плавней будет работать.

  Скрыть контент

.cForumList .ipsDataItem:hover {
	z-index:10;
	-webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.02);
	-webkit-transform:scale(1);
	-moz-transform:scale(1.01);
	-o-transform:scale(1.01);
	transform:scale(1.01)
      
      -webkit-box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	box-shadow:0 1px 20px 0 rgba(0,0,0,0.06);
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out    
}

 

 

Действительно плавнее, оно очень мягко и еле подсвечивает )