Первая подборка jQuery CSS решений для веб-разработчиков в 2012 году.Часть 13

50 новых бесплатных решений для веб-разработчиков: галереи, карусели, слайдеры, табы, меню, 3D-эффекты, фильтры, текстовые эффекты, галереи, аккордеоны и множество других функциональных фишек для использования в ваших проектах.

Обязательно посмотрите путеводитель по плагинам, в котором собрано более 700 jQuery CSS решений, разбитых по категориям.

Внимание: чтобы не пропустить новую порцию jQuery плюшек получайте уведомления на почту, по RSS или в Twitter.

1. Изображения во всплывающих блоках

Изображения во всплывающих окнах CSS3

Изображения во всплывающем блоке с использованием jQuery и CSS3. Плагин является еще одним аналогом известного решения Lightbox с потрясающими анимационными эффектами. На демонстрационной странице плагин выполнен в 3 различных вариантах с различными анимационными эффектами. Можете посмотреть еще 40 подобных плагинов.

2. Легкий слайдер контента «Swipe»

Легкий слайдер контента «Swipe»

3. jQuery CSS3 анимация с 3D эффектом

jQuery CSS3 анимация с 3D эффектом

26 превосходных анимированных jQuery CSS3 эффектов при смене изображений: 3D и другие эффекты. Просмотрите все возможные эффекты на демонстрационной странице, там собрано много потрясающих свежих примеров анимации, которую можно будет применить в разработке галерей, слайдеров и других случаях работы при работе с изображениями. Внимание: 3D эффект не работает в старых версиях браузеров.

4. Стильный jQuery слайдер

Стильный jQuery слайдер

Вы также можете посмотреть подробный урок (english) по созданию этого слайдера в формате PSD, его верстке и превращению в готовое динамическое jQuery решение. 

5. Плагин jQuery «Scroller»

Плагин Скроллер

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

6. jQuery CSS3 меню с эффектом размытия

jQuery CSS3 меню с эффектом размытия

При наведении курсора на один из пунктов меню остальные размываются на заднем плане.

7. jQuery плагин «Craftmap»

jQuery CSS3 плагин «Craftmap»

Плагин для реализации интерактивной карты мира. Карта в двух вариантах: в ограниченной области и растягивающаяся на весь экран. Плагин является бесплатным при использовании в собственных проектах, при использовании в коммерческих целях необходимо купить лицензию на сайте разработчика.

8. Анимированный эффект загрузки содержимого страницы

Эффектный анимированный прелодер

9. CSS3 галерея 3D

Галерея 3D

Галерея изображений с 3D эффектом.

10. Фильтр на jQuery

Фильтрация

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

11. Полноэкранное CSS3 слайд-шоу фоновых изображений

Слайд-шоу фоновых изображений

Фоновые изображения сменяют друг друга с различными эффектами. Размер изображения автоматически изменяется при изменении размера окна браузера. Эффект реализован с помощью CSS3. Плагин выполнен в 4 различных анимимированных эффектах.

12. Плагин «ssdZoom»

ssdZoom

jQuery плагин для увеличения изображения при наведении (zoom-эффект).

13. Онлайн калькулятор на jQuery

Онлайн калькулятор на jQuery

Онлайн калькулятор. Используемые технологии: jQuery, PHP, CSS.

14. Всплывающие подсказки на jQuery

Всплывающие подсказки на jQuery

При наведении на элемент всплывает текстовая подсказка или HTML контент.

15. jQuery галерея

 jQuery галерея

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

16. Анимированное меню

Анимированное меню

Меню с эффектом при наведении.

17. Реализация рейтинга материалов

Рейтинг материалов

Используемые технологии: CSS, jQuery и PHP.

18. Легкий CSS jQuery слайдер

Легкий слайдер jQuery

Слайдер изображений. Для навигации между изображениями используются ссылки «Вперед» и «Назад».

19. Сортировка изображений методом перетаскивания

Сортировка изображений методом перетаскивания

Сортировка с помощью метода Drag and Drop.

20. Всплывающие описания изображений на jQuery

Всплывающие подписи изображений

Описание изображений, всплывающее при наведении курсора. Еще 10 похожих решений.

21. Слайдер изображений

Слайдер изображений

Смена изображений происходит при перетягивании ползунка снизу.

22. Переключение между видами страницы

Переключение между видами страницы

Переключение отображение между табличным видом и списком. Для перехода между различными видами отображения необходимо воспользоваться ссылками сверху.

23. Слайдер на jQuery

Лекгий слайдер с описанием изображений

Лекгий слайдер с описанием изображений.

24. jQuery слайдер «Flow Slider» 

 jQuery слайдер

24. Многоуровневое выпадающее меню  «jQSimpleMenu»

Многоуровневое выпадающее меню

Свежий jQuery плагин для создания многоуровневых горизонтальных выпадающих меню на сайте.

25. Карусель jQuery

Карусели

Стильное оформление карусели изображений.

26. jQuery слайдер с каруселью из миниатюр

jQuery слайдер с каруселью из миниатюр

Просматривать слады можно с помощью карусели миниатюр, прокручивать которую можно автономно от основных слайдов.

27. Анимированный таймер отсчета

Таймер отсчета

Отличное решение для страниц-заглушек, отсчитывающих время до открытия проекта.

28. Плагин «Scrollorama»

Плагин «Scrollorama»

Плагин для создания интересных эффектов при прокрутке страницы. При прокрутке страницы используются различные анимированные эффекты, осуществляется прокрутка нескольких независимых слоев.

29. CSS3 вертикальное меню-аккордеон

Эффект размытия

Вертикальное меню-аккордеон. При наведении курсора на пункт меню появляются все вложенные в него пункты.

30. jQuery карусель

CSS3 jQuery всплывающие подсказки

Карусель изображений, растягивающаяся на весь экран.

31. Автоматический скроллер контента

Автоматический скроллер контента

32. jQuery карусель

Карусель

Карусель из блоков, проезжающих весь экран. При наведении курсора на блок движение останавливается и всплывает описание блока.

33. jQuery слайдер изображений

jQuery слайдер изображений

34. Слайд-шоу

Слайд-шоу

Слайд-шоу на jQuery. При наведении курсора на изображение всплывают кнопки навигации по слайдам и кнопка паузы.

35. Вертикальный слайдер изображений с эффектом аккордеона

Вертикальный сладйр изображений с эффектом аккордеона

36. Карусель изображений с автопрокруткой

Карсель изображений с автопрокруткой

При изменении размера окна браузера изменяются размеры изображений в карусели и их количество. Карусель растягивается на всю ширину экрана.

37. Слайдер изображений с миниатюрами

Слайдер изображений с миниатюрами

38. Анимированная jQuery карусель

Анимированная jQuery карусель

39. Слайд-шоу

Слайд-шоу

40. Вертикальная прокрутка слайдов

Вертикальная прокрутка слайдов

Для начала прокрутки нажмите на ссылку «Start scrolling»  на демонстрационной странице.

41. Описание изображений при наведении

Описание изображений при наведении

При наведении курсора на изображение выезжает его описание.

42. jQuery cлайдер с миниатюрами

jQuery cлайдер с миниатюрами

43. jQuery слайдер

Слайдер

При наведении курсора выезжают миниатюры.

44. Табы на jQuery

Табы

45. Мини-галерея изображений на jQuery

Галерея изображений

С помощью стрелок «Вверх» и «Вниз» можно прокручивать увеличенные изображения и миниатюры.

46. jQuery аккордеон

jQuery аккордеон

47. Анимированная карусель изображений

Анимированная карусель изображений

48. Смена фоновых изображений

CSS3 jQuery всплывающие подсказки

На демонстрационной странице из выпадающего списка можно выбрать эффект смены фоновых изображений. Изображения автоматически изменяют свой размер при изменении размеров окна браузера.

49. Карусель изображений

Карусель изображений на всю ширину экрана.

Карусель изображений на всю ширину экрана.

50. Слайдер изображений с всплывающими миниатюрами

Слайдер изображений с всплывающими миниатюрами

Обязательно посмотрите путеводитель по плагинам, в котором собрано более 700 jQuery CSS решений, разбитых по категориям.

Внимание: чтобы не пропустить новую порцию jQuery плюшек получайте уведомления на почтупо RSS или в Twitter.

04.01.2012
top


blog comments powered by Disqus
Рубрики
3 месяца отличного хостинга бесплатно
Система Orphus