2 заметки с тегом

jsss

CSS vs. JSSS

Почти никто не помнит, но в прошлом веке, в браузере Netscape Navigator (который позже стал Communicator) был ещё один способ задавать таблицы стилей — JSSS.

Вообще, сейчас принято с теплотой вспоминать поделие Netscape и осуждать Microsoft за самоуправство в стандартах, но тогда время было такое. Кто такие были W3C и кто — Microsoft с Netscape. В Netscape придумывали «стандартов» никак не меньше (а то и больше), чем в Microsoft. И где сейчас LAYER, MULTICOL или тот же JSSS? Впрочем, фирма Netscape в 1996 году отправила JSSS в W3C.

Выглядел JSSS примерно так (даже функции поддерживались!):

<style type="text/javascript">
 tags.p.fontSize = "14pt";
 with(tags.H2)
 {
   color = "red";
   fontSize = "16pt";
   marginTop = "2cm";
 }
contextual(tags.H1, tags.EM, ids.x78, classes.foo.all).color = evaluate_color();
tags.P.firstLine.fontStyle = "small-caps";
tags.IMG.width = .50 * document.width;
if (visual.colorDepth > 2) {
  body.bgColor = "white";
  body.color = "blue";
} else {
  body.bgColor = "black";
  body.color = "white";
}
</style>

И иногда, перебирая в голове ушедшие технологии, я задумываюсь — а не было бы принятие JSSS вместо CSS более удачным шагом? Нужно было бы учить на один язык меньше (JS уже есть в браузере), да и последние тенденции в CSS3 показывают, что он медленно двигается в сторону какой-то странного скриптового языка.

Вот пример:

@media only screen and (max-width: 1024px) {
    div {
        width: -moz-calc(100% - 2 * 3px);
        height: -moz-max(50%, 18px);
    }
}

@-webkit-variables {
   step: -1;
}

ol {
    counter-reset: list -webkit-var(step);  
}
li:before {
    counter-increment: list;
    content: counter(list) ". ";
}

Уже похоже на какой-то язык программирования, не так ли? Переменные, какие-никакие циклы, функции (min, max), условия, арифметические действия.

Так вот, нужно ли это всё было городить? В JavaScript это уже есть. Впрочем, нужны, конечно, ограничения, чтобы JSSS не превратился в труднопроходимую кашу, CSS более лаконичен и строг. Но вопрос в том, удобно ли уже сейчас читать CSS больших проектов? Я пробовал, мой ответ — вряд ли. Это чудовищно сложно.

В общем, мне кажется, что Netscape был в чём-то прав. В этом направлении стоило двигаться.

JSSS, JavaScript-based Style Sheets

В своё время, когда браузер фирмы Netscape был лидером на рынке, в нём была поддержка интересной, на мой взгляд, технологии, которая уже при рождении была незаслуженно забыта — «JavaScript-based Style Sheets» (JSSS). Сейчас эту технологию, насколько я знаю, не поддерживает ни один из существующих браузеров, а в те времена я использовал её, чтобы разделить стили для Netscape и Internet Explorer, а сейчас это представляет интерес не больше, чем Gopher.

Итак, в чём суть? Суть та же самая, что и в CSS, разница лишь в представлении. Несколько примеров, думаю, достаточно наглядно покажут суть:

<style type="text/javascript"><!--
    // H1 { color: blue }
    tags.H1.color = "blue";

    // BODY { color: black; background: white }
    with(tags.BODY) {
         color = "black";
        bgColor = "white";
     }

    // H1 EM .reddish { color: red }
    contextual(tags.H1, tags.EM, classes.reddish.all).color = "red";

    /* UL  LI { color: red }
        UL UL LI { color: blue } */
    with(tags) {
         contextual(UL, LI).color = "red";
         contextual(UL, UL, LI).color = "blue";
     }

     // P:first-line { font-style: small-caps }
     tags.P.firstLine.fontStyle = "small-caps";

     // P:first-letter { font-size: 200% }
     tags.P.firstLetter.fontSize *= 2; // 200%
--></style>

Теперь самое интересное, вычисляемые значения и функции:

<style type="text/javascript"><!--
    tags.IMG.width = .50 * document.width;

    evaluate_style() {
        if (visual.colorDepth < 2) {
             bgColor = "white";
             color = "blue";
        } else {  
             bgColor = "black";
             color = "white";
        }
    }

   tag.BODY.apply = evaluate_style()
   tag.ids.headertable.apply = evaluate_style()
--></style>