Давиче хотел найти как сделать эффект мутной прозрачности как в Vist’е и наткнулся на интересную javascript библиотеку pixastic, о ней, собственно и пойдет речь.
Можно использовать в какой-нибудь галерее для превьюшек. Например, по-умолчанию сделать их черно-белыми, а при наведении мыши-цветными.
Кстати о наведении мыши, на сайте разработчиков не нашел как сделать так, чтобы при onmouseover применялся эффект, а при onmouseout - возвращались исходные значения. Пришлось сделать самому на jquery, скачать и просмотреть реализацию (39 Kb) можно!
На сайте разработчиков можно собрать свою сборку библиотеки, в которую Вы сможете добавить только те эффекты, которые Вам нужны. Так же можно скачать библиотеку в виде плагина jquery.
P.S. По просьбам читателей реализован обратный эффект, т.е. при загрузке страницы изображение - чёрно-белое (к примеру), а при наведении мыши становится цветным.
В этом посте хочу поделиться плагинами моего любимого движка для блогов - Wordpress. Сначала хотел их упорядочить по-значимости, но не смог, так как все они хороши, и у каждого своё предназначение. Не долго думая, расположу их в алфавитном порядке. Поехали…
1. All in One SEO Pack
- позволяет устанавливать заголовки, тайтлы, метаописания , ключевые слова как для всего блога в целом, так и для каждого поста в отдельности.
2. CyStat
- очень подробная статистика посещения блога.
Основные возможности плагина:
Статистика по блогу (популярность страниц, последние комментируемые страницы, наиболее активные авторы комментариев, популярные метки и рубрики, статистика баз данных.)
Статистика клиентов (браузеры, операционные системы, браузеры по версиям, поисковые системы, инструменты и скрипты)
Временной анализ (подробная статистика просмотров и визитов за час, день, неделю, месяц, год)
Параметры (настройка фильтров, управление базами данных)
3. FeedBurner FeedSmith
FeedBurner FeedSmith - перенаправляет rss фид блога через сервис , что позволяет вести статистику по подписчикам, использованию фида и даже поможет монетизировать ваш фид, не без участия AdSense, конечно.
4. FeedBurner Widget
выводит в сайдбаре иконку FeedBurner’а с числом подписчиков Вашего блога. Немного подшаманив исходник плагина, можно выводить количество подписавшихся на комментарии, на статьи, rss-иконку. Пример у меня в сайдбаре.
5. Google XML Sitemaps
- очень полезный плагин. Когда я публикую пост, он автоматически обновляет файл sitemap.xml и оповещает об обновлениях Google.com, Ask.com,MSN.com
6. highlight.js
- плагин подсветки синтаксиса кода. Облегчает написание постов, в которых необходимо выложить исходники для примера. Плагин сам подсвечивает код.
- выводит даты в “Русском формате”. Например: вместо «13 Апрель 2009» выведет «13 апреля 2009».
8. RusToLat
- плагин производит транслитерацию русских символов URL в английские.
9. WordPress Related Posts
WordPress Related Posts - плагин в конце поста выводит похожие записи. Помогает подольше удержать посетителей в блоге.
10. WP Super Cache
- плагин генерирует HTML файлы, которые обслуживаются непосредственно Apache, без обработки сравнительно тяжелых PHP скриптов. С помощью этого плагина Вы сможете значительно ускорить ваш блог.
11. Zakladka
- плагин для добавления статей в закладки.
Основные возможности:
Управление отображаемыми ссылками через админку
Возможность как автоматической (в конце статьи по умолчанию), так и ручной вставки кода
Возможность включать/отключать аттрибут rel=”nofollow”
Возможность включать/отключать открывание ссылок в новом окне
Автоматическое отслеживание текущей версии плагина
Заключение
Все плагины проверены мной лично, все просты в установке и не прихотливы в использование. Одним словом, советую…
Фотография - это в первую очередь воспоминания, мгновение, сохраненное для будущего. Раньше эти мгновения хранились в фотоальбомах, в шкафу. Но для нашего стремительного “цифрового” времени этого мало. Необходимо дать всем желающим, или только тем, кому мы доверяем, возможность вместе с нами просматривать наши счастливые моменты жизни, для этого и была создана
Галерея — это:
личные фотоальбомы
участие в общих альбомах различных тематик
доступ к своим альбомам не только из Феодосийской локальной сети VIT, но и Интернет
возможность давать ссылки на свои альбомы и фотографии друзьям и знакомым со всего мира
Коды для вставки изображений на сайт, форум, блог
Интересные акции и конкурсы для всех
с удовольствием приглашает Вас принять участие в новом проекте — тематических фотоконкурсах. Любой конкурс - это, прежде всего, великолепная возможность заявить о себе и своих возможностях, продемонстрировать свое умение в той или иной области. Цель конкурса - выявить новых талантливых участников-фотографов, которые готовы поделиться своим взглядом на мир сквозь объектив своей фотокамеры.
Лайтбокс - простой, ненавязчивый скрипт, используется для наложения изображения на текущую страницу. Легко и быстро настраивается и работает во всех современных браузерах. Особенности: можно использовать с группами изображений и легко переключаться между ними (предыдущее - следущее). Лайтбокс анимированно ресайзится под размеры изображения. Используется prototype.
lightbox | prototype
2. Cлайдер изображений
jQuery Image Strip - слайдер изображений, с эффектом скольжения по-горизонтали. Используется jQuery.
Image Strip | jquery
3. Cлайдер изображений
slideViewer 1.1 - простой слайдер изображений, с эффектом скольжения по-горизонтали. Построен на ненумерованных списках. Используется jQuery.
slideViewer | jquery
4. Cлайдер изображений
Photo Slider - слайдер изображений, отличается от остальных автоматической прокруткой изображений, с возможностью приостановки. Используется jQuery.
Photo Slider | jquery
5. Обрезание изображений
jThumb - динамично обвертывает изображения и / или ссылки с изображениями в div. Вы можете задать им конкретные размеры (ширина и высота) в CSS файле. В кадр попадает середина изображения. Используется jQuery.
jQuery Thumbs | jquery
6. Слайдер изображений
jCarousel Lite - очень легкая галерея, всего лишь 2 kb. Позволяет прокручивать изображения, HTML - код. Используется jQuery.
jCarousel Lite | jquery
7. Эффекты смены изображений
Cycle Plugin - плагин jquery, используется для создания эффектов при смене изображений в галерее.
Cycle Plugin | jQuery
8. Галерея с миниатюрами
lightweight image gallery - галерея с миниатюрами. Используется javascript.
9. Галерея с миниатюрами
Galleria - красивая галерея с миниатюрами. Особенности: показ описания изображения, возможность листания изображений (предыдущее - следующее) Используется jQuery.
html vs jquery - самая простая галерея. В ее основе лежит html - тэг “marquee”. Управление галереей осуществляется небольшими функциями javascript. Код галереи - 10 строк (галерея + управление). Используется HTML.
html vs jquery | html + javascript
Вот, собственно, и всё! Желаю блестящих реализаций всех ваших идей.
WEB приложения разрастаются как на дрожжах примочками для удобства пользователей, в основном благодаря технологии AJAX. Если объединить аккуратную функциональность PHP и одаренность JavaScript, Вы сможете получить потрясающие результаты. Чтобы момочь обуздать эту технологию, хочу поделиться методами оказания помощи вашему сайту.
Нижеприведенный список состоит из 21 лучших свободно распространяемых компонентов и туториалов, которые, скорее всего, будут Вам необходимы в процессе разработки многих проектов. Все они высокого качества и более или менее легко настраиваемые.
Давайте посмотрим.
1.
pChart представляет собой PHP класс, ориентированный на создание псевдо таблиц. На сегодняшний день большая часть библиотеки распространяется на бесплатной основе.
Данные могут быть получены из запросов SQL, CSV файлов, или вручную. Этот проект все еще находится в стадии развития и новые функции и исправления производятся каждую неделю. Фокус был сделан на качество , чтобы графики выглядели как конфетки. Скорость резко увеличилась, в сравнении с первыми опытами, разработчики обещают продолжать оптимизировать код!
2.
PHP компонент создан в целях создания поисковой формы с автозаполнением, используется PHP и MySQL.
Этот прием стал очень популярен в последнее время. Яркие приемы применения автозаполнения - строка поиска в поисковых системах (Google, Yandex и т.д. ).
Если Вы огромный поклонник WordPress, тогда знаете, что когда Вы нажмете на ссылку удалить (например комментарий или запись), тогда удаляемый пункт становится красным, и исчезает. Вот как можно достичь этой функциональности с MooTools JavaScript.
if(isset($_GET['delete']))
{
$query = 'DELETE FROM my_table WHERE item_id = '.(int)$_GET['delete'];
$result = mysql_query($result,$link);
}
4.
Валидация (проверка) данных является неотъемлемой частью работы с формами. Так как неверно предоставленные данные могут привести к проблемам безопасности, и взлому Ваших сайтов. В этом туториале мы взглянем на то, как устранить недопустимые символы и подтверждения данных с помощью функций “filter_var”.
5.
В этом туториале Вы узнаете, как создать систему входа на сайт с помощью PHP и MySQL. В нём рассмотрены многие функции: в том числе MySqli, подготовленные приглашения, jQuery, классы сессии, cookies и т.д.
6.
В этом туториале вы научитесь создавать простые PHP классы:
Создание базы данных
Подключение к базе данных
Показ формы с двумя полями
Сохранение данных формы в базу данных
Показ сохраненных данных из базы данных
7.
Если вы заходили на Reddit, Вы наверное заметили, каким образом люди там голосуют. Вы можете голосовать за или голосовать против. Достаточно интересно, да? Этот туториал поможет Вам создать такую систему голосования с помощью jQuery, PHP и MySQL.
8.
Это PHP класс, который обрабатывает запросы баз данных, создает AJAX страницу навигации и даже создает Javascript для Вас.
Переход по страницам происходит без перезагрузки страницы, что, в свою очередь, экономит ресурсы сервера.
9.
Вы ищете решение для кэширования тяжелых страниц и преобразования их в статическую HTML версию на некоторое время? Вот это решение для буферизации вывода.
Простым способом отслеживать файлы является использование дерева каталогов. В дереве каталогов листья из файлов и каталогов, так что можно легко найти то, что вы ищете. В этом туториале описано создание дерева каталогов с использованием PHP и jQuery.
11.
Узнайте, как можно с использованием jQuery, PHP, и немного AJAX подключиться к Twitter API и вернуть результат. При загрузке HTML вызывается функция JavaScript getSearch (), чтобы возвращать Twitter API результаты каждые 30 секунд.
12.
Проверка паролей на прочность становится всё более популярной в современном сайтостроительстве. Google использует этот прием при создании учетной записи в Google. Причем проверка идет не только на количество символов в пароле, а и на сложность пароля (содержание заглавных букв, строчных букв, цифр и знаков).Вот как можно сделать это самостоятельно.
13.
Резервное копирование данных является чрезвычайно важным. В большинстве случаев база данных является самой важной частью головоломки. Представьте себе потерять все данные в базе данных - это было бы трагичным. Вот фрагмент кода PHP, для сохранения вашей базы данных в виде XML.
Узнайте, как интегрировать пользовательский поиск Google в результаты поиска на Вашем сайте, и настроить его стиль по своему вкусу.
15.
Простая функция, которая просто передает HTML по электронной почте в простом текстовом формате с вложениями, используя AOL 2.5.
16.
В этом туториале рассказывается как проверить свою форму с помощью PHP и jQuery с «двух сторон»: на стороне клиента (с использованием JavaScript, jQuery) и стороне сервера (с помощью PHP). Думаю Вам будет интересно узнать о том, как использовать регулярные выражения для проверки различных типов электронной почты, паролей и многое другое.
17.
Как создать динамическийAJAX-чат, основанный на jQuery с нуля. Будет очень интересно узнать, как использовать AJAX функции jQuery и как они могут быть использованы для вставки и выборки данных из базы данных MySQL через PHP асинхронно.
18.
Когда вы используете сложный дизайн, CSS файлы могут быстро стать очень большими, и требовать много времени для загрузки. Здесь находятся 3 интересных способа сжатия CSS-файлов с помощью PHP.
19.
Основное преимущество этого сценария заключается в том, что он позволяет изменять размеры и обрезать любое изображение на Вашем веб-сайте, не касаясь фактического изображения и без написания какого-либо кода.
20.
Данная форма будет возвращать проверенное сообщение, если сообщение было отправлено успешно. Или же будет выведено сообщение об ошибке при попытке отправить пустое сообщение или если адрес электронной почты является недействительным.
21.
Это PHP скрипт позволит вам загрузить JPG изображения, изменить его размер, в случае необходимости и обрезать с учетом его высоты и ширины.
