CSS-Expressions on DOMReady (CSS+JS в одном файле)

[sunnybear]

а выражения одноразовые?

зачем вообще два файла, если все в один можно положить?

[madimp]

Если указать property, то одноразовые. А файл и есть один. Все в файле стилей.

[sunnybear]

файлов два — еще JS

[madimp]

Файл один. Подключается дважды. Сначала как скрипт, потом, как стили.

[sunnybear]

да, посыпал голову пеплом )

[sunnybear]

вообще стоит в тематический блог перенести. Тогда выйдет на главную, народ еще пообсуждает

[madimp]

Я тут новичек. Какой посоветуете?

[seraph]

Для того, чтобы JS не лез в DOM, пока он ещё не готов, есть атрибут defer. Работает вроде только в IE, но и CSS Expressions тоже только в IE до 8-й версии будут работать.

Для остальных браузеров существуют своие собственные методы, сигнализирующие о завершении формирования дерева DOM, для fx есть с 3.1 метод calc(). Разве не лучше использовать кроссбраузерную обёртку, чем обёртку только для ie?

[madimp]

defer, говорит браузеру, что скрипт не нужно запускать здесь и сейчас, а можно заниматься своими делами и не ждать пока скрипт загрузится, блокируя все остальное. Готовность DOM тут ни при чем.

Тем более, что файл стилей не есть файл скрипта.

[seraph]

The defer attribute specifies that the execution of a script should be deferred (delayed) until after the page has been loaded.

Defer говорит браузеру о том, что не нужно запускать яваскрипт до тех пор, пока не загрузится html-документ. Для ie, насколько я помню это подразумевает «пока не загрузится и не распарсится html-документ и не построится DOM-дерево».

По поводу того, что это файл стилей и для него defer не сработает я и возражаю. Потому и вопрошаю: отчего бы не писать обычный js вместо expressions?

Всё, дошло, сначала неправильно понял саму цель создания обёртки )
Тогда да, Вы в принципе правы.

Ещё весьма полезны на практике кешируемые экспрешены, например, при ресайзе окна, если размеры блоков указаны в процентах.

[madimp]

HTML 4.0

When set, this boolean attribute provides a hint to the user agent that the script is not going to generate any document content (e.g., no «document.write» in javascript) and thus, the user agent can continue parsing and rendering.

Возможно, конечно, что и DOM уже построен при запуске. Тут ничего не могу сказать, не проверял.

[madimp]

По поводу кросс-браузерной обертки — CSS-Expressions работают только в IE. Так что IE Only

[seraph]

Отнюдь. В fx есть calc(), который даёт почти ту же функциональность.

Для других браузеров есть возможность сделать отложенное выполнение js до момента окончания формирования DOM-дерева. Это, конечно, не экспрешены, но с поправкой на то, что я сначала подумал, что Вы добиваетесь в первую очередь отложенной загрузки, это было ещё актуально.

[madimp]

Если бы expressions работали не только в IE, тогда ясно, что надо было бы делать кросс-браузерную обертку, но в данном случае оно не требуется.

[hulinada]

экспрешн внутри экспрешена. омг

[madimp]

вызов пользовательской функции внутри экспрешна

[AndrewStephanoff]

не за это ли хаяли IE6?

[madimp]

Спорный вопрос. Кто-то хаял, а кто-то говорил, что хорошо придумали — можно сделать то, что нативно не поддерживается, с помощью извращений.

[leMar]

Вам надо было придумать это раньше, до того как IE6 решил, что зажился на этом свете. IE 7 по большей части expression не нужны, а IE 8 в expression и вовсе не поддерживает.

[madimp]

IE7 из реализованного не поддерживает :before, :after, селектор по аттрибутам и border-spacing.
Поддерживает лишь :first-child и минимальную/максимальную ширину

[ArtyV]

Не сказал бы, что решение красивое

[madimp]

Красота — понятие относительное.
Для такой странной штуки, как expressions, вполне сгодится, я считаю.

[kizu]

О, клёво, спасибо :)
Есть над чем помедитировать.

[madimp]

Всегда пожалуйста :)

[Delka]

я такое делаю так:

span.block-before,span.block-after {zoom: 1; font-size: 1px; position: relative}
html*div.text-block {
   scrollbar-face-color: expression(document.getElementById("bottom") ? (
    this.runtimeStyle.scrollbarFaceColor = "#fff",
    insertAdjacentHTML('afterBegin','<span class="block-before"></span>'),
    insertAdjacentHTML('beforeEnd', '<span class="block-after"></span>')) : '#fff'
   )
}

в качестве свойств на которое навешивается expression — использую проприентарные scrollbar-свойства, а проверку загрузки DOM делаю обращаясь к блоку что всегда находится внизу html — #bottom.

в js я к своему стыду ещё плохо разбираюсь, поэтому как вы проверяете готовность DOM неразобрался(
могли бы пояснить?

[madimp]

Попыткой прокрутки document.documentElement.doScroll(«left»);
Разумеется на 0 пикселей.
Если DOM не готов, вызывает ошибку. Соответственно, если не вызывает, можно действовать.

DOMready = setInterval(function(){
	try{
		document.documentElement.doScroll("left");
		clearInterval(DOMready);
		DOMready = true;
		for (var f in fn){
			fn[f]();
		}
	}catch(e){}
}, 10)

[Delka]

спасибо!
а что делает

for (var f in fn){
  fn[f]();
}

[madimp]

В fn у меня хранятся функции (действия), запущенные из экспрешна, и ждут своего часа.
Когда DOM готов, т.е. ошибки нет и блок try выполняется дальше попытки прокрутки, запускаются все эти функции.
При вызове «действия» проверяется готов ли DOM. Если готов функция запускается сразу, а если нет — складируется в fn.

if (DOMready === true){
	action(el, add);
} else {
	fn.push(function(){
		action(el, add);
	});
}

[madimp]

Т.е.

for (var f in fn){
  fn[f]();
}

есть не что иное, как перебор и запуск функций, хранящихся в fn.

[Delka]

ага, спасибо большое!