Красивое портфолио или топовые новости

Стильное решение для создания портфолио, горячих новостей, топовых фотографии и реализации других задач.

Хочу поделиться с Вами красивым решением для создания портфолио, горячих новостей, топовых фотографии и т.п. Решение базируется на основе jQuery и easingPlugin. Для начала пример того, как это выглядит и работает (поводите курсором по изображениям).

Чтобы его подключить, нужно добавить код в страницу:сайт источник http://yapro.ru Sat Mar 06 2010 12:43:50 GMT+0300

<script language="Javascript" type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.easing.js"></script>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

Теперь немного о том, как это работает.
Всё удобно представлено в виде:

<ul><li><a><img alt="Изображение наезжающее сверху"><img alt="Изображение основное"></a></li>...</ul>

Ширина конструкции прописывается в классе portfolio

.portfolio { width:1004px; }

Высота конструкции зависит от высоты изображений и количества получившихся ячеек (блоков).
Чтобы изменить ширину или высоту блоков, нужно поправить их следующим образом:

.portfolio li { width:250px; height:200px }
.portfolio li a { width:250px; height:200px; }

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

Ссылки: пример в отдельном окне» | скачать архив примера»

Оцени публикацию:
  • 4,16
Оценили человек: 4

Похожие статьи:

Справочники и учебники:


Предложения и пожелания:
Ваше имя:
Ваш E-mail:
Введите изображенные цифры:
Captcha
Главная
X

youtube.com/watch?v=7hFivbgIEqk

При полном или частичном использовании материалов данного сайта, ссылка на сайт "yapro.ru" обязательна как на источник информации.
Автоматический импорт материалов и информации с сайта запрещен.
Copyrights © 2007 - 2017 YaPro.Ru

Главная » Веб-мастеру » JavaScript »