Исключительно главное о веб дизайне. » javascript / Статьи о веб дизайне, верстке, photoshop,illustrator, javascript. Wed, 19 May 2010 17:55:14 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Несколько удивительных javascript игр /javascript-igri/ /javascript-igri/#comments Sat, 20 Mar 2010 23:09:07 +0000 mironov /?p=335 В последнее время о возможностях javascript говорят часто. Повсюду используется Jquery анимация на сайтах, все браузеры стараются ускорить обработку javascript кода, в HTML5 включили тег canvas специально для javascript-приложений, на Youtube появился HTML5 плеер, теперь есть даже возможность создания javascript приложений для сайта vkontakte.ru.

На javascript теперь еще и игры делают, некоторые из которых вы и найдете ниже.
Для просмотра игр рекомендуется браузер Google Chrome. Также этот браузер рекомендуется для всего остального.

Browser Pong

Javascript игры
Эта штука стоит внимания. В игре вы управляете непосредственно окнами браузера и играете ими в пинг – понг

Real world racer

Javascript игры
Это гонки, но не обычные, а по реальному миру. Используя Google Maps API разработчики игры сделали возможным выбор любого маршрута на земле, например Париж – Дакар. Выбираете маршрут – начинается гонка! Идея почти гениальна!

Twitch

Javascript игры
Опять манипуляции с окнами браузера. Игра немного нудная, но интересная

Browser Ball

Javascript игры
Перекидывать мячик из одного окна браузера в другое, как не странно, очень увлекательное занятие :)

Crystal Galaxy

Javascript игры
Это вообще полноценный шутер. Всё как положено. Космический корабль, метеориты и т.д.

Video & Picture Puzzle

Javascript игры
Пазл из окон браузера. Не очень удобно, но идея стоит внимания.

Apophis 2029

Javascript игры
Игра вsgjkytyf в интересном стиле и неплохо убивает время.

Bing-Bong

Javascript игры
Уверен, вы уже играли в похожую игру и не раз, ничего нового, но всё равно интересно.

Pacman

Javascript игры
Легендарный Pacman теперь и на Javascript :)

Bunny Hunt

Javascript игры
Стара добрая “Охота на уток”, только с зайцами и на JavaScript.

JS Wars

Javascript игры
Еще один космический шутер.

Berts Breakdown

Javascript игры
3D Синий желейный человек бегает и собирает Евро.

Кстати, можно:

Подписаться на обновления сайта h1h1.ru через RSS,

]]>
/javascript-igri/feed/ 0
Lightbox – Немного света /lightbox-nemnogo-sveta/ /lightbox-nemnogo-sveta/#comments Mon, 28 Sep 2009 15:29:28 +0000 mironov /?p=87 Лайтбоксы нынче очень востребованы блоггерами, да и не только. Для фотографов это очень крутой способ создавать хорошие галереи своих снимков. Для простых смертных – просто хороший способ не засорять сайт огромными изображениями. Вашему вниманию я хочу представить самые интересные, на мой взгляд, методы реализации этого красивого эффекта.

Начнем с самого простого, для обычного пользователя, примера. А именно плагина для Wordpress – Jquery Lightbox. Он привлек мое внимание своей простотой, плагины то все устанавливать на Вордпресс умеют. В использовании нет ничего сложного – после установки плагина, каждоe мини-изображениe, по клику на которое вы задумали показать в лайтбоксе его полную версию, нужно обернуть в теги гиперссылки (’a') и прописать в атрибуте к тегу ‘a’ ‘rel=”lightbox”‘ :

Подробнее на примере:

<a href="wp-content/uploads/2009/09/maxi_image.jpg" title="реальный размер картинки" rel="lightbox">
          <img src="wp-content/uploads/2009/09/mini_image.jpg" alt="маленькая картинка" />
</a>

Вот еще один способ реализации лайтбокса – jQuery Fullsize Plug-in. Он интересен своей задумкой – добавления нового атрибута к изображению в HTML5. Смысл идеи заключается в облегчении жизни веб-разработчиков путем сваливания всей работы лайтбокса на плечи браузеров. Выглядеть, по их мнению, все будет так:

<img src='mini.jpg' atl='img' fullsize='full.jpg'/>

То есть больше не придется скачивать, устанавливать и настраивать скрипты, а можно будет просто прописать к тегу ‘img’ атрибут ‘fullsize’ и указать в нем путь к реальному размеру картинки. Вы можете проголосовать за эту идею на их официальном сайте, если вы тоже мечтаете о таком светлом будущем.

Еще один интересный и простой вариант – плагин для Jquery BlockUI. Он не создан специально для показа изображений. С помощью этого плагина можно ‘выключать свет’ на сайте и показывать в светлом окне что угодно. ОН потрясающе прост в использовании – все примеры есть на официальном сайте.

И последний, самый интересный, пример реализации лайтбокса. У него есть одна особенность, которой нет ни у одного из других плагинов/скриптов. Он совершенно не использует JavaScript. Да, вы не ошиблись. Это значит, что даже те редкие пользователи, очень беспокоящиеся за свою безопасность и отключающие JavaScript на своих браузерах, смогут насладиться красотой лайтбокса! Найти код можно вот здесь. Способ, конечно не самый красивый, но кроссбраузерный и валидный.

]]>
/lightbox-nemnogo-sveta/feed/ 0