css fix для различных браузеров

[vastvision]

Вот, вот, вещь нужная 100%
Спасибо.

[Toshik]

Спасибо большое за данную фичу очень пригодится в жизни :)

[NamelessOne]

Большое человеческое спасибо!

[bidlocoder]

Ну такую функцию можно было и без jQuery написать

[bidlocoder]

Вот теперь гуд!

[k0rzhik]

Это ж хорошо, что гуд ;)

[inlanger]

Это не индивидумы, а странные люди. Таким надо отрывать конечности, за фразы - "я отключил яваскрипт, почему теперь не работает функция?"

[k0rzhik]

OMG ENABLE JAVASCRIPT YOU NOOB!! :)

[k0rzhik]

черт, хабр ноускрипт сожрал :(

[homm]

У меня не работала функция копирования текста со страницы. Я отключил яваскрипт, скопировал текст. Я не прав? Иди оторви себе сам что-нибудь.

[homm]

> Это не "не работала функция", а хозяин пытался запретить копировать текст!
Как будто это кому-то не понятно было.

Что правильно? Что JS должен быть включен везде и всегда?

Приведу другой пример.
Когда http://translate.google.com/ только открылся, в бете оперы 9.5 работать в нем было невозможно. А вот если JS отключить — вполне работал. Дак почему бы мне его не отключить на том сайте? Хотя я знаю почему, потому что вы не гугл, у вас наверное не будет ни желания ни возможности сделать рабочий интерфейс без JS, поэтому ваш сайт будет работать только в браузерах, в которых вы его протестируете.

[khim]

Воровать тексты плохо.

Воровать тексты - плохо. Цитировать - хорошо. Не было бы хорошо, не было бы в законе даже специально предназначенных правил объясняющих когда и как это делать в случае, когда владелец текста этого явно не разрешил.

[EugeneDest]

Такой афтар пусть запишет свой текст на дискету, спрячет её в сейф, и надев этот сейф на шею прыгнет с моста в реку... Там его текст ниииикто не станет копировать.

[ZUGA]

И даже после такого "хитрого" маневра, кому надо, тот прочитает.

[inlanger]

Я имел в виду людей, отключающих яваскрипт совсем, а не для единичных случаев.

[homm]

Я могу отключить яваскрипт совсем для твоего сайта, если он сделате мне подобную подляну или не будет работать корректно по иным причинам.

[arty]

для того, чтобы работать с html, должно быть достаточно умения работы с html

веб-приложения типа гуглокарт и гугломыла — это одно, а веб-сайты — это другое

[S2nek]

Сначала оторвите конечности разработчикам и-за которых так приходится поступать.

[klierik]

что бы избавиться от _height и тд и тп надо использовать условные комментарии. Получаем Валидный CSS ;)

[an9eldust]

>условный комментарий - это хак.
ORLY?

[k0rzhik]

#id{color:#fff}
html>body #id{color:#333}

[k0rzhik]

а также проблемы ~70% юзеров, которые им пользуются?

[k0rzhik]

а вообще с этими юзерами надо делать так
html>
head>
script>
for (x in document.write) { document.write(x);}
/script>
/head>
body>
noscript>
style>@;/*
/noscript>
/body>/html> :)

[Sabiko]

Повторюсь) Хак это не невалидный и недументировнный коктейль из палочек и звёздочек.
"поддерживаемое чем-то одним" — йес. И именно поэтому какое-нибудь html:first-child .style {} — хак для О., будь он хоть тысячу раз документирован.
Фишка и определение хака как раз в том, что ты никогда не знаешь, что ещё начнёт его поддерживать и что вдруг перестанет.

[k0rzhik]

Ну это уже не в этом блоге обсуждать :)
а что тогда по-вашему #id{_background:#03F;}?

[besisland]

Чем это противоречит спецификации CSS?

[besisland]

Спецификация CSS не запрещает указывать свойство «_background» и содержит прямые и однозначные указания на сей счёт.

[besisland]

См. 4.1.2.1 и 4.2.

[besisland]

Учите матчасть.

1. Нормативной версией является только английская.

2. Одобренного W3C русского перевода CSS 2.1 не существует.

3. В русском переводе CSS 2.0 имеется, по крайней мере, упомянутое правило в секции 4.2.

[an9eldust]

В отличие от, мгм, хаков, conditional comments никак не повлияют на валидность вашего кода.

[Sabiko]

Хак — это такая инструкция, которую на данный момент понимает определённый браузер или группа браузеров.
Абстрактно — есть некий хак, работающий в IE6 и 7, в восьмом он работать перестал. А ошибка, которую вы исправляли с помощью хака, в восьмом осталась. Или ещё абстрактнее: в сырой версии браузера хак работал, и вы его осознанно использовали под этот браузер, а потом разработчики выбустили багфикс и хак умер.

Кондишенал комментс — это средство, предусмотренное разработчиками, и оно будет всегда срабатывать именно под те браузеры, под которые вы задумали. К хакам никакого отношения не имеет.

[muhas]

Спасибо.
в закладки, прикодиться когда-нить

[mytribune]

Решение короткое и изящное, спасибо!
Вспоминаются мрачные времена mac.domain.ru и koi.domain.ru... Ещё обычно было два css файла: ie.css и netsc.css :) Так хотелось от этого избавиться. Но, увы, пока надо продолжать терпеть несоответствия стандартам или их неточности.

[vyacheslavka]

Не убирайте статью

[decaz]

Занеси в избранное.

[vyacheslavka]

забавно:) вы серьезно думали что я просил не убирать статью с главной:)?

[Olegas]

Круто! Но IE6 не всегда корректно обрабатывает .class1.class2 =(

[vladzima]

Спасибо! Всегда мучался этим вопросом.

[itlife]

Можно ещё так.. на условных комментариях... вообще без js .. ну если мало то в конкретных случаях ещё добавляем скрипт в частости скрипт о котором говорится в статье

</head>
<script type="'text">
$(function(){
if($.browser.opera)$('body').addClass('opera');
if($.browser.safari)$('body').addClass('safari');
});
</script>
</head>
#!--[if lte IE 6]><body class="ie6 ie7 ie8">#![endif]-->
#!--[if lte IE 7]><body class="ie7 ie8">#![endif]-->
#!--[if lte IE 8]><body class="ie8">#![endif]-->
#![if !IE]><body class="noie">#![endif]>

</body>

Решётку(#) надо заменить на <
в ie7 на выходе у body будет класс "ie7 ie8" а у ie6 будет "ie6 ie7 ie8"
Так удобно.. так как имхо если делается корректура для ie7 то тем более её надо делать и для ie6 бывает наверно и исключения... Opera и safari добавил для примера чаще достаточно одного ie6.
Если условные комментарии повесить на div то будет и успешная валидация xhtml

[LightAlloy]

а как быть с "абстрактной ситуацией" (firefox и мак)?

[itlife]

использовать скрипт из топика и исключения в css) или переделать вёрстку так чтобы не требовалось разделение мак - не мак, помоему это всегда возможно.

[caIIIa]

Это вы какую-то фигню говорите, да и мак-юзеры, как правило, постоянно и централизованно обновляют все программы до последней версии...

[itlife]

Забыл сказать, что приведён класный скрипт спасибо.
Мой пример это то чем сам пользуюсь...
да в услоный комментариях операционку не определишь=)

[Wharfadale]

Всё хорошо, конечно, но, к сожалению, этот скрипт хорошо только на 70-80%, так как иногда ява-скрипты просто отключают:(

[try4tune]

Сейчас без javascript 90% сайтов будут работать некорректно.

[Wharfadale]

У меня начальник на предыдущей работе ставил огнелисы и блокировал исполнение яваскриптов на всех компах:)

[small_jam]

Насяльника непонимать нас хайтек?

[small_jam]

Корпоративный сайт, как портрет Мао ))

[Wharfadale]

Насялника раздражал попап
А минусанули и правда зря, я только недавно разговаривал с одним разработчиком, так вот он предлагал поставить скрипт. Я целых три дня потратил на то, чтобы разобраться, нужно илил нет. Так вот помимо статистики, пообщался со многими программёрами и разработчиками. Они сказали ни в коем случае не ставить js.
Я бы сейчас выложил что нарыл, да вот только найти не могу.
Кстати, всем мой совет: верстайте так, чтобы было кроссбраузерно в любом случае! Это несложно, многие даже и не подразумевают, какие возможности html и css хранит спецификация.

[Wharfadale]

Опередили. Вот тут больше и лучше:)

[Wharfadale]

Мне почему-то показалось, что по вашей ссылке она неполная(?):)
Попытался ссылку вставить, но не получилось:( http://pyramidin.narod.ru/html401/

[small_jam]

да не минусовал я вас, прицепились :)
а история конечно забавна, все равно что спросить "нужны бонусы или нет"
яваскрипт доставляет в разы меньше проблем, чем плюсов, если использовать с головой конечно

[Wharfadale]

Он потом вообще на Линукс пересел... и весь офЕсный планктон пересадил))))

[small_jam]

93%-95% =)

[bidlocoder]

Я вот тоже хотел сначала написать, что нифига не не 70-80%. Потом пошел на http://gs.spylog.ru/r/?reportId=14&categ…
Если верить этой статистики, то получается 20% без js сидят. Удивило. Так что зря наверное минусанули.

[bidlocoder]

Упс. Фигню написал. Столбцы перепутал :)
Где кстати актульную статистику по js посмотреть?

[small_jam]

Простите, но спайлог не авторитет
http://www.w3schools.com/browsers/browse…

[bidlocoder]

спс

[Jenek]

этот скрипт можно и на сервере реализовать

[TimSparrow]

полезная вещь, добавил в закладки

[amduscias]

Клевый скрипт! Мог бы плюсануть, обязательно бы сделал это

[Goganchic]

Однозначно нужная вещь! Без вопросов "+" в карму :)

[ipod]

Сам писал нечто подобное, но без ОСей.
Чтобы небыло пресловутой зависимости от JS, можно вынести подобную логику на серверную часть.
А за класс спасибо)

[AlexDebian]

Спасибо

[Aux]

Хорошая статья! Жаль не могу поставить плюс...

[izorg]

В случае jQuery уже есть такой плагин http://jquery.thewikies.com/browser/#features. В нём уже есть весь этот функционал. В первой версии там даже функция была addSelector для отдельных элементов, а не только html, но addClass'a теперь уже достаточно.

[k0rzhik]

This was all written in the following languages.
1. jQuery v.1.2.6
2. jQuery Flash v.1.01 ~ 8.4kb
3. jQuery sIFR v.2.0b ~ 7.4kb
4. jQuery browser ~ 2.5kb

есть разница?

[izorg]

Не совсем понял вопрос про разницу. Если вопрос в том, что необходимо для плагина Browser, то кроме jQuery ему ничего не нужно. А то, что автор пишет какими средствами он пользовался при создании сайта, то тут конечно я его и сам не совсем понимаю ;)

[small_jam]

размер имеет значение

[izorg]

согласен, размер важен, но jQuery я использую почти всегда, т.к. сокращается мой код, а jQuery Browser подключается исключительно там, где это необходимо, да и всё же весит это добро в minified варианте 1.22Kb, что совсем уж незаметно ;)

Я лишь хотел указать, что подобное решение уже существует и развивается (уже версия 2.0). Если же Вы сами для своих нужд это написало - МОЛОДЕЦ. Я бы с радостью плюсанул такое начинание, т.к. сам лентяйничаю делать что-либо подобное, а вот использовать всегда рад :)

[k0rzhik]

Да, пардон, посмотрел исходник. Думал просто ему все плагины нужны для работы. Не сплю уже часов просто :(
ЗЫ тот код кстати больше ;)

[Astralian]

Спасибо. По любому в будущем пригодиться.
Кстати давно небыло никаких статей в ВебДеве.

[xmagnusx]

добавил в закладки.
спасибо

[eatart]

отличное решение. но, все таки надеюсь, не пригодится

[pepelsbey]

Имхо, определение IE из данной функции стоит убрать, потому как условные комментарии не просто позволяют делать это очень гибко, но ещё и избавляют нормальные браузеры от лишнего трафика.

Ну или в любом случае заменить определение IE на максимально стабильное, безо всяких операций со строками:

/*@cc_on

    @if (@_jscript_version < 5.7)

        ltIE7 = true

    @end

    @if (@_jscript_version < 5.6)

        ltIE6 = true

    @end

@*/

[neudor]

 k0rzhik, ты молодец.

[hemper]

Когда-то портировал из ExtJs в Prototype подобное, может кому-то пригодится ;)


Util = {};
Browser = Prototype.Browser;
(function() {
var ua = navigator.userAgent.toLowerCase();

Browser.Opera = ua.indexOf("opera") > -1;
Browser.Safari = (/webkit|khtml/).test(ua);
Browser.IE = !Browser.Opera && ua.indexOf("msie") > -1 && window.attachEvent;
Browser.IE7 = !Browser.Opera && ua.indexOf("msie 7") > -1;
Browser.IE6 = Browser.IE && !Browser.IE7;
Browser.Gecko = !Browser.Safari && ua.indexOf("gecko") > -1;
Browser.Strict = document.compatMode == "CSS1Compat";
Browser.BorderBox = Browser.IE && !Browser.Strict;
Browser.PngSupport = true;
Browser.AjaxSupport = Ajax.getTransport();
Browser.Secure = window.location.href.toLowerCase().indexOf("https") === 0;
Browser.Nice = (typeof encodeURIComponent != 'undefined') && (typeof document.getElementById != 'undefined');

if (Browser.IE) {
var v = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');
if (v != null && Number(v[1]) < 5.5) Browser.PngSupport = false;
};

// remove css image flicker
if (Browser.IE6) {
try {
document.execCommand("BackgroundImageCache", false, true);
} catch(e) {}
};
})();

Util.Dom = {
attachBrowserCss: function() {
var bd = Util.Dom.getBody();
if (!bd) {
return;
}

var cls = [Browser.IE ? "ie " + (Browser.IE6 ? 'ie6': 'ie7') :
Browser.Gecko ? "gecko":
Browser.Opera ? "opera":
Browser.Safari ? "safari": ""];

if (Browser.PngSupport) cls.push("png");
if (Browser.Mac) cls.push("mac");
if (Browser.Linux) cls.push("linux");
if (Browser.BorderBox) cls.push('border-box');
if (Browser.Strict) { // add to the parent to allow for selectors like ".strict .ie"
var p = bd.parentNode;
if (p) p.className += ' strict';
}
bd.addClassName(cls.join(' '));
},

getBody: function() {
return $(document.body || document.documentElement);
}
};

[lig]

ппц. может еще будем быков осеменителей не той породы в нужный цвет перекрашивать, чтоб телка его за своего приняла?

нормальный верстальщик может и должен писать кроссплатформенный css.

said enough.

[lig]

не в зоопарке дело... а в профессионализме

i-phone - это уже мобильное, там пока единое найти трудно, хотя, на самом деле, тоже отлично находится, когда желание есть

а когда желание "хаки" вешать, тогда уже и о профессионализме речи нет

[oRb]

не сдержался)

[k0rzhik]

Меня уже откровенно вырубает, спать хочу..
Но что-то я не понял, в чем подвох?

[atri]

подвох в том, что на скриншоте опера, а скрипт выдает мозиллу... и оперу тоже

[homm]

Насколько я вижу по строке, скрипт выдает ваш юзер-агент.

[ZUGA]

Этот подвох является функцией оперы. Вклчючается и выключается вашими руками.

[oRb]

именно! Маскировка под лису меняет только юзерагент, а парсинг и рендер остается от оперы. Конечно айдитория, которая пользуется маскировкой под лису весьма мала, но она все же есть.

[lig]

javascript для форматирования контента - зло

[DmitryBaranovskiy]

Плыли-плыли и приплыли. Сколько уже раз писалось и говорилось об опасности browser sniffing?
Если вы горе-верстальщик, то JavaScript вам не поможет, а это ламерство уже в печени сидит.
«Ах, какой полезный скрипт!» Да вы что? Шутить изволите? Почитайте хотя бы это на вскидку: http://dev.opera.com/articles/view/a-bro…
http://www.quirksmode.org/blog/archives/…

[mocksoul]

идиотизм

у меня получается поддерживать в весьма не простом дизайне все 14 браузеров (ff2/ff3 win+mac+lin, safari2/3 win+mac, konqueror-3.5.8/3.5.9, ie6, ie7, ie8beta, opera 9.2x/9.5x) без ветвлений в верстке вообще.

И вам советую так же.

[dfuse]

www.quirksmode.org/blog/archives/2006/07/browser_detect.html — хорошая, пусть и немного старая, статейка на тему определения браузера. В кратце — ничему нельзя доверять. Даже navigator.vendor нельзя доверять, тем более userAgent.

[TuTbaker]

В FF3.5 не работает :( пишу gecko — ноль внимания