Блина, оказывается сделать вывод корректный PNG с transparnt-слоем, достаточно проблематичная штука (что бы в Inter Explorer от 6.0 пахала, Fire Fox ну и Opera).
Что это за хитрый слой? ну допустим вам на основную картинку нужно вывести картинку, которая содержит прозрачные точки... Получается красиво, но ...тень полная.
Проблема номер 1.
Как вывести тупо IMG с градиентом/транспорантом - проблем нет.
Для примера пишем:
<img style="BEHAVIOR: url(png.htc)" height="12" src="http://www.blogger.com/png-test-files.png" width="12" />
где png.htc типа хака (можно взять тут) - http://textlibrary.ru/files/png.htc
---------------
Проблема номер 2.
Как вывести допустим для боковой рамки налаживаемую тень на имеющийся под ней слой. То есть картинка вставляеться как фон, допустим таблицы (при этом высота не заданна - то есть любая, до 1000 пикселей):
В HTML для ячекий таблицы пишем что-то такое:
.........
<td class="png" width=""><img height="1" alt="" src="http://www.blogger.com/spacer.gif" width="12" />
..........
В CSS пишем такое для класса png:
.png {
background: url('png-test-files.png');
-background-image: none;
-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=png-test-files.png,sizingMethod=crop);
}
........
где png-test-files.png - наш фоновый рисунок размером допустим 12 на 1000 пикселей.
---------------
Проблема номер 3.
Как вывести графическую кнопку PNG с ховерсом.
В HTML для кнопки пишем следующий код:
.........
<div class="testclass"><a href="http://www.blogger.com/index.php"><img height="14" alt="" src="http://www.blogger.com/spacer.gif" width="38" /></a></div>
.........
В CSS пишем такое для класса testclass:
.testclass a{
background: url('home.png');
background-repeat: no-repeat;
display: block;
width: 38px;
line-height: 14px;
height: 14px;
-background-image: none;
-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=home.png,sizingMethod=crop);
cursor:pointer
}
.testclass a:hover{
background: url('home_h.png');
background-repeat: no-repeat;
-background-image: none;
-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=home_h.png,sizingMethod=crop);
}
Где home.png - оригнальный вид графической кнопки, home_h.png - графическая кнопка при наведении на не курсора мыши.
Вообщем в итоге, поразмыслев решил что можно от варианта №1 вообще отказаться.
Главная проблема которая возникла при работе с PNG, совсместимость с Internet Explorer 6.0 :)
вторник, 17 июня 2008 г.
четверг, 5 июня 2008 г.
Пару плагинов для Fire Fox которые я постоянно использую
Использую их для анализов сайтов, структуры скорости загрузки и т.д.
Допустим выявили то что наличия авторизации в htaccess не дает кэшировать файлы сайта и таким образом увеличивает время его полной загрузки в 2.5-3 раза :)
Собственно вот и они:
Web Developer 1.1.6
https://addons.mozilla.org/ru/firefox/addon/60
Adds a menu and a toolbar with various web developer tools.
Firebug 1.05
https://addons.mozilla.org/ru/firefox/addon/1843
Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
Допустим выявили то что наличия авторизации в htaccess не дает кэшировать файлы сайта и таким образом увеличивает время его полной загрузки в 2.5-3 раза :)
Собственно вот и они:
Web Developer 1.1.6
https://addons.mozilla.org/ru/firefox/addon/60
Adds a menu and a toolbar with various web developer tools.
Firebug 1.05
https://addons.mozilla.org/ru/firefox/addon/1843
Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
воскресенье, 1 июня 2008 г.
Про то чем сейчас занимаюсь в свободное время
Общая упрощенная схема того, что было задумано:
Описание блока Граббер.
1.1. По заданным признакам копирует содержимое WEB-сайта (его страниц).
Я пока выделяются несколько видов ссылок.
А) Информационные ссылки (содержащие информацию, там текст новости);
Пример для Лента.ру: http://lenta.ru/news/([0-9]{4})/([0-9]{2})/([0-9]{2})/([a-z])(.*)/$
Б) Навигационные ссылки (страницы которые могут содержать ссылки на страницы с информацией);
Пример для Лента.ру: http://lenta.ru/([a-z]){2,15}/$
В) Информационные ссылки II (страницы имеющие на одном URL информацию, которую можно представить в виде нескольких информационных страниц, то есть новости идут общим текстом на главной страницы (без кнопочек Подробнее), но есть возможность через регулярное выражение или шаблон автоматически их разбивать).
Г) RSS-каналы (могут быть использованы как для получения б), так как и а));
Для каждого вида информационной ссылки а), в) и г), может быть задан отдельный шаблон для получения текста исходной статьи (а так же отдельно, заголовка, времени, автора, ссылки на источник и т.д., то что может быть выделено заданным шаблоном).
Возможна встройка алгоритмов автоматического определение информационного содержимого страницы (видел такие в Инете). Они позволяют получать информацию со страницы без задания шаблона.
Пример шаблона для граббинга для Лента.ру новости:
{title} - заголовок;
{text} – содержимое;
{skip} – пропустить.
Теги {data}, {category}, и еще пару, пока не задействованы.Выполнено по аналогии с News Grabbers.
1.2. Помещает их в общую БД.
1.2.1. Проверка статьи на уникальность.
1.2.2. Добавление статьи в общую БД.
1.2.3. Исключение текущего URL из дальнейшего рассмотрения.
1.2.4. Поиск новых URL по пунктам а)-в) и добавление их на индексацию (ограничение если необходимо опционально, то есть установка фильтров на а)-в), брать только новые материалы, или определенное количество или ….)
1.3. Классифицирует.
Классификаторы могут быть автоматические и статические.
Статические – задание список категорий и ключевых слов. Статья причисляется к какой-то категории или ее подкатегории по наличию в теле ключевых слов.
Автоматические – задается слово или список ключевых слов, а категории строятся автоматически по базе имеющихся статей. Возможен вариант автоматического расширения списка ключевых слов.
На данный момент реализовано: 1.1. (а,б,г), 1.2 (кроме 1.2.4 и 1.2.1 - пока тупо сравнивает заголовки и сам текст, без вычисления % совпадения текстов), 1.3 – в процессе.
1.1. По заданным признакам копирует содержимое WEB-сайта (его страниц).
Я пока выделяются несколько видов ссылок.
А) Информационные ссылки (содержащие информацию, там текст новости);
Пример для Лента.ру: http://lenta.ru/news/([0-9]{4})/([0-9]{2})/([0-9]{2})/([a-z])(.*)/$
Б) Навигационные ссылки (страницы которые могут содержать ссылки на страницы с информацией);
Пример для Лента.ру: http://lenta.ru/([a-z]){2,15}/$
В) Информационные ссылки II (страницы имеющие на одном URL информацию, которую можно представить в виде нескольких информационных страниц, то есть новости идут общим текстом на главной страницы (без кнопочек Подробнее), но есть возможность через регулярное выражение или шаблон автоматически их разбивать).
Г) RSS-каналы (могут быть использованы как для получения б), так как и а));
Для каждого вида информационной ссылки а), в) и г), может быть задан отдельный шаблон для получения текста исходной статьи (а так же отдельно, заголовка, времени, автора, ссылки на источник и т.д., то что может быть выделено заданным шаблоном).
Возможна встройка алгоритмов автоматического определение информационного содержимого страницы (видел такие в Инете). Они позволяют получать информацию со страницы без задания шаблона.
Пример шаблона для граббинга для Лента.ру новости:
[/tr][/tbody][/table][h2]{title}[/h2]{skip}[/iframe][/td][/tr][/table]{text}[p][/p]
{title} - заголовок;
{text} – содержимое;
{skip} – пропустить.
Теги {data}, {category}, и еще пару, пока не задействованы.Выполнено по аналогии с News Grabbers.
1.2. Помещает их в общую БД.
1.2.1. Проверка статьи на уникальность.
1.2.2. Добавление статьи в общую БД.
1.2.3. Исключение текущего URL из дальнейшего рассмотрения.
1.2.4. Поиск новых URL по пунктам а)-в) и добавление их на индексацию (ограничение если необходимо опционально, то есть установка фильтров на а)-в), брать только новые материалы, или определенное количество или ….)
1.3. Классифицирует.
Классификаторы могут быть автоматические и статические.
Статические – задание список категорий и ключевых слов. Статья причисляется к какой-то категории или ее подкатегории по наличию в теле ключевых слов.
Автоматические – задается слово или список ключевых слов, а категории строятся автоматически по базе имеющихся статей. Возможен вариант автоматического расширения списка ключевых слов.
На данный момент реализовано: 1.1. (а,б,г), 1.2 (кроме 1.2.4 и 1.2.1 - пока тупо сравнивает заголовки и сам текст, без вычисления % совпадения текстов), 1.3 – в процессе.
Подписаться на:
Сообщения (Atom)