Archive for Октябрь, 2009

26ОктFireBug для IE, Safari, Chrome и Opera

Firebug, как все уже давно знают – один из самых мощных и удобных инструментов для разработки, но Firefox – далеко не единственный браузер в мире и разработчикам приходится иметь дело еще и с такими браузерами как своенравный IE, юркая Opera, хитрый Safari и загадочный Chrome :). И было бы неплохо для удобства работы иметь аналог Firebug еще и в них.
Тут в дело вступает Firebug Lite – простая JavaScript-библиотека, которая воссоздает во всех этих браузерах интерфейс Firebug. С помощью пары строк кода мы получаем столь необходимый инструмент для всех платформ. Одним из важных преимуществ Firebug Lite является то, что он, в отличие от “старшего брата”, не требует установки: достаточно добавить в заголовок нужных страниц вызов онлайн-версии скрипта:

Если же кто-то хочет использовать локальную версию оффлайн (что, в общем-то, намного удобнее и быстрее) – можно скачать исходники здесь. Импортируйте firebug-lite-compressed.js или firebug-lite.js в директорию вашего сайта. Найдите firebug-lite.css в импортированном файле и замените его локальным адресом файла firebug-lite.css.

Теперь при запуске страницы в браузере в нем будет присутствовать Firebug Lite. Вот как это выглядит в ИЕ:

Firebug Lite

Конечно, эта библиотека не заменяет на 100% весь функционал Firebug. Например, отсутствует дебаггер JavaScript (кто-нибудь знает, как писать дебаггер JavaScript на JavaScript???) и так же в нем нет указания координат инспектируемого элемента. Есть определенные неудобства с редактированием CSS. Тем не менее, даже такой FireBug – это значительно лучше и удобнее, чем его полное отсутствие для браузеров, отличных от Gecko-based, и определенно стоящее того, чтобы регулярно им пользоваться.

Оригинал статьи: #.

Категория: HTML/CSS и Разнософт. 2 Комментариев

20ОктVista Switcher

Нашел интересную бесплатную утилиту под названием Vista Switcher. Фактически это замена (или, правильнее сказать, расширение функционала) комбинации Alt-Tab. Эта программа заменяет обычное диалоговое окно Alt-Tab на более подробное окно со скриншотом выбранной задачи. Одним кликом можно переключиться в нужное окно (с предварительным просмотром его), свернуть его, развернуть или же завершить процесс. Рекомендую всем попробовать – у меня программа сразу же вошла в список обязательных к применению утилит.

Vista Switcher

Скачать Vista Switcher (текущая версия 1.0.3).
Программа работает под XP, Vista и 7 и существует так же и в 64-битной версии.

Категория: Разнософт. 0 Комментариев

19ОктIMDB search Opera widget

Виджет для Оперы для поиска по IMDb.
Я уже делал несколько поисковых виджетов для моего любимого браузера Opera, но все они были предназначены, так сказать, для локального применения. Побродив по директории виджетов, с удивлением обнаружил, что для крупнейшего сайта в мире о фильмах IMDb нет ни одного виджета (в то время как, например, для Гугла – десятки). Решил заполнить этот пробел и создать (а точнее, адаптировать) поисковый виджет. Времени на работу ушло немного, т.к. использовались уже наработанные шаблоны.
Виджет работает так же, как и встроенный в IMDb поиск. Можно искать по всем рубрикам, или же по какой-то одной из 12 (Названия, Имена, ТВ эпизоды и так далее).
Установить IMDB search Opera widget с директории Опера. Локальная версия здесь (при установке с локального зеркала Опера может выдать предупреждение о безопасности – на запрос ответить “Да”).
Пожелания, комментарии и баг-репорты очень ожидаются и приветствуются.

[english version]
I’ve already developed a few search widgets for my favorite browser Opera, but all of them are intended for a local audience. Browsing a widget directory at Opera, I was surprised to discover that there are still no search widgets for IMDb – the largest site about movies in the world, while there are dozens of widgets, for instance, for Google. I’ve decided to quickly fill this gap and create a simple widget for IMDb search. It didn’t take a lot of time as I used the same templates I’d been through before.
Widget functions just like IMDb built-in native search. You can search all categories or narrow your search down to some selected category.
You can download and install IMDB search Opera widget from Opera directory, or use a local mirror (if you use mirror link, you can get a security warning from Opera – answer “Yes”).
Wishes, comments, and bug-reports are expected.

Категория: Разнософт. 2 Комментариев

18ОктКроссбраузерно совместимое качество PNG

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

1. В Фотошопе включить proof colors (View -> Proof Colors)
2. Удостовериться, что Proof Setup настроен на Monitor RGB (View -> Proof setup -> Monitor RGB)
3. При сохранении для web (Save for web) выставить 24-битный PNG, отключить interlacing и снять галочку Convert to SRGB.
(Не будет работать в ИЕ6, но кому он нужен?..)

Категория: HTML/CSS. 3 Комментариев

14ОктКнопка ReTweet от TweetMeme

Твиттер сегодня, что назвается, “наше все” и сервисы к нему появляются (и умирают) с фантастической скоростью. Одним из десятков (если уже не сотен) является сервис TweetMeme, который можно назвать своего рода “Digg для Твиттер”. Кому не хотелось бы, чтобы посты с его блога отправлялись на TweetMeme с такой же легкостью, как и на Digg? Для этого умные люди (то есть не я :)) придумали простое решение.
В functions.php вашей темы добавьте вот такой простой код:

function tweetmeme(){
	return '



';
}
add_shortcode('tweet', 'tweetmeme');

и… все! Теперь при написании поста, вставьте в пост (в HTML-режиме) шорт-код [tweet] и он отобразит кнопку от TweetMeme.

Категория: WordPress. 0 Комментариев

11ОктОпределитель (селектор) браузера с помощью CSS

CSS browser selector (определитель браузера с помощью CSS) – это маленькая JS-библиотека, которая определит User-Agent браузера для написания специфических классов CSS для того или иного браузера.

Git: git://github.com/rafaelp/css_browser_selector.git
Либо забирать здесь: http://github.com/rafaelp/css_browser_selector/blob/master/css_browser_selector.js

1. Вставить строку в заголовок страницы, внутри тэга HEAD:

2. Установить атрибуты классов для нужных браузеров и ОС, например:

html.gecko div#header { margin: 1em; }
.opera #header { margin: 1.2em; }
.ie .mylink { font-weight: bold; }
.mac.ie .mylink { font-weight: bold; }
.[os].[browser] .mylink { font-weight: bold; } -> без пробелов между .[os] и .[browser]

Коды ОС [os]:
win – Microsoft Windows
linux – Linux (x11 и linux)
mac – Mac OS
freebsd – FreeBSD
ipod – iPod Touch
iphone – iPhone
webtv – WebTV
mobile – J2ME (напр.: Opera mini)

Коды браузеров [browser]:
ie – Internet Explorer (все версии)
ie8 – Internet Explorer 8.x
ie7 – Internet Explorer 7.x
ie6 – Internet Explorer 6.x
ie5 – Internet Explorer 5.x
gecko – Mozilla, Firefox (все версии), Camino
ff2 – Firefox 2
ff3 – Firefox 3
ff3_5 – Firefox 3.5 new
opera – Opera (все версии)
opera8 – Opera 8.x
opera9 – Opera 9.x
opera10 – Opera 10.x
konqueror – Konqueror
webkit или safari – Safari, NetNewsWire, OmniWeb, Shiira, Google Chrome
safari3 – Safari 3.x
chrome – Google Chrome
iron – SRWare Iron

Допольнительный код:
js – доступен, когда java-script включен, так что можно скрывать/отображать нужное

Страница библиотеки.
Демо. В примере, использованном в демо, квадрат окрашивается в разный цвет, в зависимости от браузера.

CSS, использованный в примере:

.ie .example {
  background-color: yellow
}
.ie7 .example {
  background-color: orange
}
.gecko .example {
  background-color: gray
}
.win.gecko .example {
  background-color: red
}
.linux.gecko .example {
  background-color: pink
}
.opera .example {
  background-color: green
}
.konqueror .example {
  background-color: blue
}
.webkit .example {
  background-color: black
}
.example {
  width: 100px;
  height: 100px;
}
.no_js { display: block }
.has_js { display: none }
.js .no_js { display: none }
.js .has_js { display: block }
Категория: HTML/CSS. 0 Комментариев

01Окт15 самых полезных плагинов для Google Chrome

1) Google Chrome Backup
Этот плагин помогает создать профайл, добавить существующий, удалить, сделать резервную копию, восстановить, создать ярлык, отобразить детали.

2) Портативный (переносной) Chrome
Облегченная версия Chrome. Достаточно распаковать и запустить ChromeLoader.exe. Все настройки и профиль будут сохранены на диск.

3) XChrome – A Google Chrome Theme Manager
Управление темами для Chrome. Этот плагин позволяет установить новую тему (скин) за секунды без необходимости возиться с default.dll и еще с его помощью можно просматривать информацию об авторе перед установкой темы.

4) Chrome Pass
Утилита для восстановления пароля, которая позволяет просматривать логины и пароли, сохраненные в Google Chrome. Для каждого пароля отображается соотв. оригинальный УРЛ, УРЛ действия для пароля, поля имени пользователя, поле пароля, логин, пароль и дата создания.

5) Google Chrome Channel Chooser
Google регулярно выпускает обновления Chrome для канала Dev. Канал Dev используется для доступа к новым возможностям браузера, возможностям в разработке и исправлений свежих ошибок. Обратная связь от пользователей канала Dev позволяет Google улучшать старые идеи и разрабатывать новые и удостовериться, что все работает нормально перед релизом в более широкую аудиторию.

6) Google Chrome Dual View Plugin
Этот плагин разделяет окно браузера на 2, позволяя просматривать 2 сайта одновременно.

7) AdSweep (AdBlock)
Плагин для скрытия рекламы на просматриваемых сайтах.

8) Google Page Rank / Alexa Rank Checker
С помощью этого плагина можно просмотреть Page Rank текущей страницы. Плагин представляет собой букмарклет, который можно использовать и в FireFox, Safari или Inetnet Explorer.

Постовые:
отдых в оаэ
работа
новогодние туры 2009

9) Googlepedia Extension For Chrome
После установки этого плагина, он отображает соответствующие поисковому запросу статьи из Wikipedia. Клик по ссылкам запускает новый поисковый запрос.

10) Customize Your New Tab Page
С его помощью можно изменять вид новых табов.

11) Mcafee Site Advisor Bookmarklet
Если хотите просмотреть информацию Mcafee Siteadvisor о просматриваемом в данный момент сайте, кликните на этом букмарклете и в новом табе откроется подробная информация и рейтинг от Mcafee Siteadvisor.

12) Create Chrome Themes with Chromium Theme Creator
Инструмент для создания тем/default.dll.

13) AdBlock for Google Chrome
Это не плагин, а туториал, с помощью которого можно блокировать рекламу на любом сайте.

14) Greasemetal – Greasemonkey for Chrome
Это плагин аналогичный Greasemonkey для FireFox или Greasekit для Safari – управление пользовательскими java-script’ами.

15) Google Chrome Theme Starter Kit
Этот плагин содержит 276 изображений из оригинального default.dll (библиотеки изображений стандартной темы Google Chrome).

Категория: Разнософт. 3 Комментариев
Спонсоры: