Результаты голосования: Что вы используете для решения проблем с полупрозрачными PNG в IE6?

8 комментариев 25 ноября 2009, Написано в Разное

Результаты голосования: Что вы используете для решения проблем с полупрозрачными PNG в IE6?

Несмотря на не очень большое количество проголосовавших, видно, что большинство использует IE PNG FIX — наверное самый распространённый способ решения проблемы на данный момент. Я же с недавних пор стал использовать DD_belatedPNG, по крайней мере до выхода 2-й версии IE PNG FIX, в которой должны быть реализованы возможности, уже присутствующие в DD_belatedPNG.

Некоторые проголосовавшие используют методы которых не было в голосовании. Ребята, отпишитесь в комментах, какой именно способ используете.

P.S. В декабре, в Питере пройдёт Seo New Year Party 2010, где соберутся самые-самые сеошники и вебмастера Санкт-Петербурга, Москвы и других городов. Подробности тут.

Метки: ,

Выпадающее меню без javascript версия 2

19 комментариев 8 октября 2009, Написано в CSS

На CSSplay недавно была опубликована новая версия выпадающего меню без использования javascript. В этой версии никаких хаков, условных комментариев и таблиц для IE6. В очередной раз убеждаюсь, что в большинстве случаев нельзя говорить о чём-либо строго определённо, в данном случае о невозможности создания подобного меню без использования js. И хотя предыдущая версия была также реализована без использования скриптов, но для IE6 код представлял из себя некое извращение. Перейти к статье…

Метки:

JQuery плагин: AnythingSlider

14 комментариев 29 сентября 2009, Написано в Javascript

Автор блога CSSTricks, Chris Coyier, представил на своём блоге, созданный им слайдер контента, который сочетает в себе лучшие свойства подобных аналогов, а так же имеет некоторые новые возможности.

Возможности плагина следующие:

  • В слайде может быть любой контент.
  • Кнопки предыдущего и следующего слайдов.
  • Автоматически создаётся меню со ссылками на каждый слайд.
  • Возможность изменения текста ссылок на предыдущий и следующий слайды.
  • Автоматическая прокрутка слайдов.
  • Каждый слайд имеет якорь, что позволяет ссылаться на него.
  • Возможность использования нескольких экземпляров на одной странице (якоря будут работать на первом).
  • Пауза при наведении курсора мыши.

Демо

Параметры по умолчанию:

easing: "easeInOutExpo",        // Вид анимации. Все виды анимации кроме "linear" и "swing" требуют дополнительный плагин
autoPlay: true,                 // Добавляет функционал автоматической прокрутки
startStopped: false,            // Блокирует автоматическую прокрутку при первой загрузке
delay: 3000,                    // Временной интервал между переходами
animationTime: 600,             // Время анимации
hashTags: true,                 // Добавляет якоря к слайдам
buildNavigation: true,          // Генерация ссылок на каждый слайд
pauseOnHover: true,             // Пауза при наведении
startText: "Старт",             // Текст кнопки «Старт»
stopText: "Стоп",               // Текст кнопки «Стоп»

Подключается плагин также как и большинство других плагинов, поэтому описывать в сотый раз думаю не нужно, достаточно посмотреть приведённый пример. Оформление слайдера находится в файле slider.css. Для увеличения количества слайдов, нужно добавить нужное количество элементов li, в списке, находящемся внутри блока с классом wrapper.

Метки: ,

Полупрозрачные PNG в IE6 с помощью DD_belatedPNG

41 комментарий 24 августа 2009, Написано в Разное

Еще один способ решения проблем полупрозрачных PNG в IE6 — DD_belatedPNG.

DD_belatedPNG использует VML вместо AlphaImageLoader. Соответственно способ не обладает минусами присущими применению фильтра. Инструмент позволяет использовать свойства background-position и background-repeat, а также псевдо-класс :hover. Ссылки и элементы форм в блоке с полупрозрачным фоном остаются кликабельны.

Демо

Использовать скрипт очень просто:

  • Скачайте javascript файл (сжатая версия — 7Kb).
  • Подключите его к странице.
  • Укажите какие элементы необходимо исправить. 
<!--[if IE 6]>
  <script src="DD_belatedPNG.js" type="text/javascript"></script>
  <script type="text/javascript">
    DD_belatedPNG.fix('.png-elem');
  </script>
<![endif]-->

Для fix() требуется указать CSS селектор исправляемого элемента. Если необходимо исправить несколько элементов, нужно указать их через запятую.

На первый взгляд хорошая альтернатива IE PNG Fix, который я использовал раньше.

P.S. На днях ко мне обратился Руслан и предложил взять интервью для своего блога о блогах. Собственно читайте кому интересно. До меня кстати интервью давал Dimox.

Метки: ,

Position fixed в IE6

10 комментариев 3 августа 2009, Написано в CSS

Так как IE6 не поддерживает значение fixed свойства position, обычно для эмуляции данного эффекта используют position:absolute и CSS expression. Однако в результате при скроллинге или изменении размеров окна браузера возникали небольшие подёргивания фиксированного блока.

#fixed{
  position:fixed;
  left:0;
  top:0
}
#fixed{ /* Стили для IE6 */
  position:absolute;
  top:expression(eval(document.documentElement.scrollTop))
}

Видимо IE имеет несколько этапов рендеринга страницы. Сначала браузер заново перестраивает содержимое и уже после обрабатывает CSS выражения, что и приводит к подёргиваниям.

Решение заключается в том, чтобы добавить элементу html или body фоновое изображение. В результате браузер сперва обработает таблицу стилей, а после перерисует страницу. Это, в свою очередь, сделает перемещение фиксированного блока плавным.

В качестве значения background можно использовать about:blank.

html{
  background:url(about:blank)
}

Метки:

«12345»...Последняя »