cross-browser web development

pilot

Существуют ли Javascript'овые библиотеки со стандартизированным API, скрывающие различия между браузерами?
(как пример - event target в firefox и msie - по-разному ищется).
Список различий браузеров?
Чем в виндовс проверяют правильность работы Javascript? Script Debugger'ом? ( в файрфокс есть javascript console, например, и extensions).
Правильно ли я понимаю что при изменении атрибута class элемента страницы - msie не пересчитывает расположение и оформление элементов на странице заново?
Насколько хороши "эмуляции IE" для мозиллы и файрфокса? какие?

kruzer25

Правильно ли я понимаю что при изменении атрибута class элемента страницы - msie не пересчитывает расположение и оформление элементов на странице заново?
Неправильно понимаешь.
Прежде чем задавать такие тупые вопросы, сам бы попробовал.

dedwowan

Чем в виндовс проверяют правильность работы Javascript? Script Debugger'ом?
Не в виндовс, а в ИЕ. Включением алертов об ошибках. Хотя удобства джава консоли в лисе он не обеспечивает.

pilot

Не в виндовс, а в ИЕ. Включением алертов об ошибках. Хотя удобства джава консоли в лисе он не обеспечивает.
Забавная такая есть у меня страничка: ни одного алерта об ошибке, и не работает.

pilot

При этом работает в файрфоксе и опере, естественно.
Поставил script debugger - жутко неудобная штука, вот и интересно, те кто ваяет под ИЕ чем пользуются.

dedwowan

а ты их включил?
они по дефолту выключены

pilot

 

<html>

    <head>

        <title>test</title>

        <script type="text/javascript">

        setTimeout(function{ 

            document.getElementById('div').getAttribute('class')=='active' ?

                document.getElementById('div').setAttribute('class','inactive') :

                document.getElementById('div').setAttribute('class','inactive');},

          3000);

          /*

        setTimeout(function{ 

            document.getElementById('div').className=='active' ?

                document.getElementById('div').className='inactive' :

                document.getElementById('div').className='active';},3000);

          */

        </script>

        <style type="text/css">

            div.active {

                background-color: #FAFAFA;

                }

            div.inactive {

                background-color: #AAAAAA;

                }

        </style>

    </head>

    <body>

        <div id="div" class="active">Simple div</div>

    </body>

</html>

Закомментарен - правильный вариант
Где-нибудь написано почему getAttribute и setAttribute не работают в ИЕ? (точнее, они работают, но эффекта не производят)

artimon

Потому что IE как всегда идёт своим, никому не веданым, путём.
Почитай: http://xpoint.ru/know-how/JavaScript/Atributyi

skvoria

Список различий браузеров?
Довольно обширен, Борьба модели MSIE vs Gecko, различия dhtml- и dom- методов работы, особенности интерпретации некорректного html (пример: <b><i>a</b></i>) и мерзкие фичи с реализацией всяких стандартов (css, css2, css3...)
С ходу пара ссылок:
http://www-128.ibm.com/developerworks/web/library/wa-ie2mozg...
http://www.mozilla.org/docs/dom/domref/dom_shortIX.html
Существуют ли Javascript'овые библиотеки со стандартизированным API, скрывающие различия между браузерами?
Шаги в этом направлении - библиотека klayers от Сергея Круглова
Чем в виндовс проверяют правильность работы Javascript? Script Debugger'ом? ( в файрфокс есть javascript console, например, и extensions).
Я смотрю стандартным дебаггером, обычно его хватает.
Правильно ли я понимаю что при изменении атрибута class элемента страницы - msie не пересчитывает расположение и оформление элементов на странице заново?
Хз, посмотри, если чо - двигайся в сторону recalc. Вообще врядли.

skvoria

Где-нибудь написано почему getAttribute и setAttribute не работают в ИЕ?
Потому что не тот атрибут ставишь.
setAttribute('className', ... );

artimon

Ты не прав. Атрибута className нет. Есть атрибут class и свойство className. Почитай ссылку, которая дана выше.

kruzer25

Да, и ещё:
<style>

.s1 { background-color:red; };

.s2 { background-color:green; };

</style>

<div id="abc" class="s1">lkjh</div>

<a href='javascript:document.getElementById("abc").setAttribute("className","s2")'>lkjh</a>

Отлично работает в ИЕ6.

kruzer25

Нет, он прав.

When setting the CLASS attribute using this method, set the sName to be "className", which is the corresponding Dynamic HTML (DHTML) property.

pilot

Ответ осатётся прежним - неправильно.
Можно менять через жопу, тогда то, какой это атрибут, и какого элемента - неважно.
А можно менять нормально - и тогда всё будет персчитано.

2 & : Большое спасибо, хорошие ссылки.
Klayers - старые... Функциональность ограничена. Так что и правда это только шаг в нужном направлении.
Про эмуляторы никто не в курсе?

artimon

Так я и говорю, что IE bдёт своим путём. По стандарту так быть не должно.

kruzer25

По какому стандарту? По этой ссылке? Или по этой?
Дай мне ссылку на w3c, из которой будет понятно, почему ИЕ в этом плане не удовлетворяет стандарту.

artimon

В статье выше всё чётко разжёвано.

pilot

 <html>

    <head>

        <title>test</title>

        <script type="text/javascript">

        </script>

        <style type="text/css">

                a:link {

            color: #000000;

            text-decoration:none;

            }     /* unvisited link */

        a:visited {

            color: #000000;

            text-decoration:none;

            }  /* visited link */

        a:hover {

            color: #000000;

            text-decoration:none;

            background-color : #EFEFEF;

            }   /* mouse over link */

        a:active {

            color: #000000;

            text-decoration:none;

            }   /* selected link */

        </style>

    </head>

    <body>

        <a>1111111111</a><br/>

        <a>2222222222</a><br/>

        <a>3333333333</a><br/>

    </body>

</html>

Здесь ИЕ не выделяет <a></a> при проведении по нему мышкой. Почему?
(погуглив нашел что a:hover не выделяет в элементах списка, но здесь не тот случай)
В firefox 1.0.7, firefox 1.5, opera 8.52 - работает.

kruzer25

Ну что же ты как ребёнок, а?
http://msdn.microsoft.com/workshop/author/dhtml/reference/pr...
Там же написано - для _ссылок_.
А у тебя ссылка где?
И вообще,
This pseudo-class is defined in CSS, Level 2 (CSS2)
А полную поддержку CSS2 врроде пока что никто не обещает (во всяком случае, недавно было так).

pilot

А у тебя ссылка где?

А посмотреть?
Если не знаешь ответ то лучше не пиши.

kruzer25

А я посмотрел.
Блок a - ещё не ссылка.
А если ты туда допишешь href="xxx" (чтобы стал нормальной ссылкой) - всё заработает.

pilot

А я посмотрел.
Блок a - ещё не ссылка.
А если ты туда допишешь href="xxx" (чтобы стал нормальной ссылкой) - всё заработает.

Спасибо.
А можешь по своей ссылке показать где такое написано? Или ты как ребенок?

kruzer25

Блять, вот ты тупой.
http://msdn.microsoft.com/workshop/author/dhtml/reference/ob...
Всё ведь человеческим языком сказано:
Designates the start or destination of a hypertext link.
The a element requires the href or the name property to be specified
Чтобы это было ссылкой, очевидно, требуется свойство href.

pilot

Чтобы это было ссылкой, очевидно, требуется свойство href.
Ты думаешь я английский не понимаю?
По-моему тут еще про name свойство упоминается. Так вот с ним тоже не работает.
А мне нафиг не нужно href, я из <a/> кнопочки делаю. И видимо проще всего ловить mouseout и mouseover всякие.

kruzer25

По-моему тут еще про name свойство упоминается. Так вот с ним тоже не работает.
Так вот, с name будет не link.
Если бы ты читал внимательнее, понял бы это с самого начала.

koly

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

pilot

How I Learned to Stop Worrying and Love IE
http://www.quirksmode.org/css/condcom.html
Conditional comments only work in Explorer on Windows, and are thus excellently suited to give special instructions meant only for Explorer on Windows. They are supported from Explorer 5 onwards, and it is even possible to distinguish between 5.0, 5.5 and 6.0.
I myself use conditional comments in the top frame. If you view its source you'll see
<>

http://labs.silverorange.com/images/tabsupdate/index.html - cross-browser CSS Tabs

pilot

Существуют ли Javascript'овые библиотеки со стандартизированным API, скрывающие различия между браузерами?
http://www.dojotoolkit.org
http://freshmeat.net/projects/dojo/

pilot

Можно ли узнать ширину кнопки и ширину поля ввода в <input type=file/>?
Размер текстового поля - можно (теоретически) узнать как size. А сколько он в пикселах?
Т.е. задача такая: есть знать "на кнопке в <input typ=file/> мы или нет"

pilot

И даже круче:
http://www.cross-browser.com/x/lib/view.php

kruzer25

Кстати, уже не помню, какой ие стоял тогда, но сейчас. в седьмом - всё отлично работает.
ЗЫ: Посмотрел - ИЕ7 у меня стоит с конца марта... хрень какая-то...

pilot

Я проверял на 6-м.
7-й еще в общем-то не вышел, так что проверять на нем конечно можно, но народ будет смотреть 5-м и 6-м.

pilot

Upload progress meter
http://php5.bluga.net/UploadProgressMeter/demo.php?debug=tru...

kruzer25

Не грузицца

pilot

У меня грузится.
Тогда так:
http://blog.joshuaeichorn.com/archives/2005/05/01/ajax-file-...
Оставить комментарий
Имя или ник:
Комментарий: