Deerua about Coding -> Заметки с тегом «framework» @ deer.org.ua

javascript

framework

Страницы: 1 | 2

14 апреля 2009, 10:30 более года назад

Универсальный IE6 png fix

Перерыл пол интернета в поисках этого «пнгфикса», вариаций более-менее достойных было с 10, но на сложной вёрстке они убивали дизайн полностью, и фиксили не до конца, кроме одного!

Представляю, это DD_belatedPNG (сейчас версия 0.0.7альфа но он уже может всё!) и как они говорят, это «Medicine for your IE6/PNG headache!»

Скачать DD_belatedPNG

Что же он может:

фиксить все png, как просто картинки (<img>) так и динамически вставляемые;
фиксить все фоновые png (как одиночные так и повторяющиеся) для любых тегов, при этом нормально обрабатывается background-position and background-repeat;
фиксить инпут в виде картинки (<INPUT type=«image»/>);
Автоматически добавляет позишон:релейтив (для ИЕ6 очень важно);
не использует картинки (blank1px.gif) для фиксов и технологию ДиректИкса (filter:progid:DXImageTransform.Microsoft.AlphaImageLoader), то есть нужен только джаваскрипт! Использует технологию MS, что называется VML (//Vector Markup Language//);
после фикса, у всех элементов сохраняется кликабельность;
не нужно уродовать css с помощью **behavior: url**
+ он фиксит :hover для ИЕ6!

Есть одно но! К тегам <TR> и <TD> лучше не применять ;) да и вообще кому нужна вёрстка на таблицах ;)

Рецепт:
Скачайте Джаваскрипт, положите в корень сайта например и подключаете

<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
  /* EXAMPLE */
  DD_belatedPNG.fix('.png_bg');
  
  /* string argument can be any CSS selector */
  /* .png_bg example is unnecessary */
  /* change it to what suits you! */
</script>
<![endif]-->

Подключаете только для ИЕ6, и только для нужных элементов! Оптимизирован для ИЕ6! Может выбирать как по классам, так и по айди, так и просто по тегам, кому как удобно! Например я использовал такое подключение %) DD_belatedPNG.fix(’img, div, li, a’);, так как дизайн был полностью из пнгшек!

зы: DD_belatedPNG is free software under the MIT License.
ззы: Кто не хочет нагружать страницу каким-либо джаваскриптом, для того есть ещё один метод, и называется он

PNG8 с альфа каналом.

7 комментариев

Теги: browsers microsoft Internet Explorer IE6, javascript framework png fix, шпаргалка

4 декабря 2008, 11:22 более года назад

YASS: Yet Another cSS selector

Вот тут можно скачать YASS, который поможет быстрее всех выбрать все нужные DOM элементы по маске!
как использовать? :) всё просто:

_('a.link'); // выбрать все теги <a> с class="link"
_('.link span'); //выбрать все теги <span> внутри тега с class="link"
_('p'); //выбрать все теги <p>
_('#p'); //выбрать все теги с id="p" 
_('#p .link'); //выбрать все теги с class="link" внутри тега с id="p"
_('#p #sp1'); //выбрать все теги с id="sp1" внутри тега с id="p"
_('p#p'); //выбрать все теги <p> с id="p"
_('p a'); //выбрать все теги <a> внутри тега <p>
_('.link'); //выбрать все теги с class="link"
_('.link #sp1'); //выбрать все теги с id="sp1" внутри тегов с class="link"
_('img'); //выбрать все теги <img>
_('body p img'); //выбрать все теги <img> внутри тега <p>, что внутри <body>
_('a, img'); // выбрать все теги <a> и <img>

скачать 0.1ю версию для ознакомления с принципом работы 6Kb (русские комментарии)

1 комментарий

Теги: javascript framework yass, css selectors, html w3c DOM

1 мая 2008, 00:32 более 2-х лет назад

Empty HTML and reset CSS — just start work!

Очень часто, в начале проекта (верстка, тестовый файлик), каждый раз нужно писать стандартные вещи <html><head><body.. — задолбало!
Просто заготовочки для начала работы:

empty valid HTML just for make start easier (~1Kb)
dtd html 4.01 / simple reset css / latest yass js src

Комментировать…

Теги: html, css, javascript framework yass

Страницы: 1 | 2

Deerua about Coding -> Заметки с тегом «framework»

Блог о кодинге, автор Deerua

coding, javascript, css, html, php, jquery, mysql, deerua