Russian Armenian Chinese (Simplified) Danish Dutch English French German Hebrew Italian Japanese Korean

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

Для наглядного примера работы скрипта создания сдвигающихся ссылок при помощи CSS, обратите внимание на ссылки расположенные ниже. При наведении курсора мышки на одну из ссылок, она плавно сдвинется вправо на указанное значение (конечно же не работает в IE), а так работает в любых нормальных и современных браузерах. Если у Вас не работает, то рекомендуем поменять браузер на Mozilla FireFox :-)

 

 

<style>
#leftt p a {margin:5px; display:block;
transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
-khtml-transition: all 0.3s ease-in;
-opera-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;}

#leftt p a:hover {cursor: pointer;  
transform:translate(20px,0);
-moz-transform:translate(20px,0);
-webkit-transform:translate(20px,0);
-khtml-transform:translate(20px,0);
-opera-transform:translate(20px,0);
-ms-transform:translate(20px,0);}
</style>

 

HTML разметка кода:

<div id="leftt">
 <p>  <a href="#">Сдвигающаяся CSS  ссылка 1</a> </p>
 <p>  <a href="#">Сдвигающаяся CSS ссылка 2</a> </p>
</div>

 


© При перепечатке текстов, активная, видимая ссылка на TopWebDesign.ru обязательна.

Наверх Вниз
скрыть

Есть вопросы или нужна консультация ?

Позвоните нам по тел. +7(914)32-00-603