+7 (911) 913-40---
menu
person
[ Обновленные темы · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Эффект с изображением шар
artnovДата: Вторник, 24.06.2014, 20:58 | Сообщение # 1
Начальник сайта
Группа: Администраторы
Сообщений: 151
Награды: 0
Репутация: 0
Статус: Offline
Код
<style>    
    #circle{ display: inline-block; width: 40%; padding-top: 40%; border-radius: 100%; background: blue url(http://www.novickiy.ru/_ph/8/2/433982343.jpg?1403878296) no-repeat; background-size: 100% 100%; -webkit-animation: animaciya linear 10s infinite; /* анимация в Chrome */ animation: animaciya linear 10s infinite; box-shadow: 0 200px 100px -80px rgba(0,0,0,.5); } @-webkit-keyframes animaciya { /* анимация в Chrome */ 0% {-webkit-transform: rotateY(0deg);} 100% {-webkit-transform: rotateY(360deg);} } @keyframes animaciya { 0% {transform: rotateY(0deg);} 100% {transform: rotateY(360deg);} }    
    </style>    
    <div id="circle"></div> <a href="http://www.novickiy.ru/forum/5-135-1">КОД</a>


Код
<style>    
#ball { display: inline-block; width: 40%; padding-top: 40%; border-radius: 100%; background: green url(http://www.novickiy.ru/_ph/6/948361604.jpg?1403878458); background-size: 200% 100%; -webkit-animation: animaciya1 linear 10s infinite; animation: animaciya1 linear 10s infinite; box-shadow: 0 200px 100px -80px rgba(0,0,0,.5); } @-webkit-keyframes animaciya1 { 0% {background-position: -100% 0;} 100% {background-position: 100% 0;} } @keyframes animaciya1 { 0% {background-position: -100% 0;} 100% {background-position: 100% 0;} }     
    </style>    
    <div id="ball"></div>
    <a href="http://www.novickiy.ru/forum/5-135-1">КОД</a>

Пример


Artnov
 
  • Страница 1 из 1
  • 1
Поиск: