IMfO.ru

All God’s chillun got shoes

Архив записей по категориям // dHtml

IE8: render modes (part 2)

We’ve decided that IE8 will, by default, interpret web content in the most standards compliant way it can. This decision is a change from what we’ve posted previously.

Dean Hachamovitch: Microsoft’s Interoperability Principles and IE8

Categories: dHtml,Web-билдинг | comments: (0)

IE, HTML5, createElement

HTML5 очень большой упор делает на обратную совместимость. Поэтому такие вещи, как например элемент <dialog>, можно использовать прямо сейчас: они добавляют новую семантику, и новые браузеры могут делать с ними что-то интересное, но и старые браузеры будут показывать что-то вменяемое. Но есть и другие элементы — например новые виды разделов, среди которых <footer>, <header>, <aside> — которые просто тянет использовать, но не получается. В IE6 и IE7 эти элементы неизвестны, браузер их игнорирует. Причем игнорирует настолько, что даже не дает назначить им в CSS ни одного свойства. А это значит, что <header> не получится даже заставить отображаться как блок, он будет вести себя как строчный элемент. Другими словами, использовать этот элемент сейчас можно, только если автору не интересно показывать страницу пользователям IE.

Иван Сагалаев: IE8 и HTML5

Решение есть. Правда, как обычно, через одно место.

[ read more ]

Categories: CSS,dHtml | comments: (0)

IE8: render modes (links)

У меня некоторая часть ленты сегодня состояла из сплошного IE8, а читать пока времени нет (как будто потом время появится, ага)

• ALA: Beyond DOCTYPE: Web Standards, Forward Compatibility, and IE8 by Aaron Gustafson
• IEBlog: Compatibility and IE8
• ALA: From Switches to Targets: A Standardista's Journey by Eric Meyer
• David Baron: Version information (public-html@w3.org)
• Peter-Paul Koch: The versioning switch is not a browser detect
• Anne van Kesteren: The Internet Explorer lock-in
• Jeffrey Zeldman: In defense of version targeting
• Andy Budd: Has Internet Explorer Just Shot Itself in the Foot?
• Dean Edwards: Quotes
• John Resig: Meta Madness
• Mike Davies: End of line Internet Explorer
• Robert O'Callahan: <META HTTP-EQUIV="X-BALL-CHAIN">
• Jeremy Keith: Broken
• Ian Hixie: Mistakes, Sadness, Regret
• Surfin' Safari: Versioning, Compatibility and Standards by Maciej Stachowiak
• Roger Johansson: Standards mode is the new quirks mode
• Sam Ruby: Sunsetting Quirks Mode
• John Resig: HTML5 DOCTYPE
• Eric Meyer: Version Two

Categories: dHtml,Web-билдинг | comments: (0)

IE8 standards mode

Я правильно понял, что теперь, помимо «quirks», «standards» и «almost standards», будет ещё и «IE8 standards mode», включающийся тэгом-костылём в <head/>?

«a number of innovative and beneficial features», «with respect to standards», «new web», «Acid2» — это всё, конечно, хорошо, но… Терзают смутные сомнения, что «новых» вещей типа SVG/Canvas так и не дадут; как и фиксов старых (уже без кавычек) мелочей вроде "wtf?".substr(-1) (не говоря уже о чём-то большем).

Хотя кто знает. «We will have more to share about specific standards supported in the near future». Поживём — увидим. Может и правда зашевелились.

Categories: dHtml,Web-билдинг | comments: (0)

Opera 9.50a1

Сразу выцепил взглядом

Added support for using SVGs in img elements and the CSS background-image and list-style-image properties

Changelog for Opera 9.50 Alpha 1 for UNIX

js getters/setters, getElementsByClassName, css text-shadow, selectors, overflow-x/y. И пр.

Categories: CSS,dHtml,Soft | comments: (0)

do i join them? do i kill them?

А nsIThread::interrupt — хрен, да? В Fx3 shutdown вроде делает своё дело, а Fx2 interrupt по барабану. Печаль моя темна.

Categories: dHtml | comments: (0)

Gecko. Soft hyphens (&shy;)

Bug 9101 (shy). 1999-06-30 – 2007-06-21+ (ещё чуть-чуть).

Categories: dHtml | comments: (0)

MSIE fixed

Решение, придуманное Ромой Воронежским, непостижимо и просто — чтобы избавиться от дрожаний, нужно зафиксировать фон страницы.

Техногрет: Полноценный fixed в MSIE

Хорошая штука. Хотя в наш век трудно придумать что-то действительно новое…

Categories: CSS,dHtml | comments: (0)

Gecko, E4X, @attr

<script>
  var r = <r><s/><s id="2"/></r>;
  alert(r.s.(@id == "2"));
  //~ Error: reference to undefined XML name @id
</script>

Я не знаю, баг это или такое поведение должно быть. Уже даже нет желания разбираться, тошнит всё больше и больше.

Categories: dHtml | comments: (0)

Fx2.0, E4X

В Fx2.0 что-то такое натворили с E4X, что иногда при var x = new XML("..simple..xml..string..") в компоненте браузер молчит. И не выполняет. И молчит.

В 1.5 всё работало.

(/me Утирает слезу) Дорогой мой Ex4, до скорых встреч. Мы ещё увидимся, когда ты станешь взрослым.

Categories: dHtml | comments: (0)

Gecko: nsIAlertsService, Linux и прочие OC

Для Fx под Windows работает такой код:

var image = "chrome://myExtension/skin/images/myExtension.png";
var title = "Test title", msg = "Test message";
try {
  Components.classes["@mozilla.org/alerts-service;1"]
    .getService(Components.interfaces.nsIAlertsService)
    .showAlertNotification(image, title, msg, false, "", null);
} catch(ex) {
  dump("alertsService failure: " + ex + "\n");
}

[ read more ]

Categories: dHtml | comments: (1)

Gecko: UUID generator

var uuid = Components.classes["@mozilla.org/uuid-generator;1"]
                     .createInstance(Components.interfaces.nsIUUIDGenerator)
                     .generateUUID();

lxr: nsIUUIDGenerator.idl

Categories: dHtml | comments: (1)

Gecko: mozIStorageService, SQL

Дошли руки до свежих сборок Firefox. В первую очередь меня интересовала реализация работы с БД:

[ read more ]

Categories: dHtml,Soft | comments: (3)

GM_getValue: Cyrillic letters

Для работы с Великим и Могучим в Greasemonkey (GM_getValue), сниппет на будущее:

[ read more ]

Categories: dHtml | comments: (0)

Иногда они пугают нас

Шашечки:

while (el.firstChild)
  el.removeChild(el.firstChild);

Ехать:

el.innerHTML = "";

Фанатизм без границ™

Update: да уж, зря, оказывается, забыл…

[ read more ]

Categories: dHtml | comments: (3)

Object.prototype is...

Вспомнилось.

Array.prototype.justTest = function(){}
var tArray = ["test"];
for (var i in tArray)
  alert(tArray[i]);

+ «Object.prototype is verboten»

Categories: dHtml | comments: (1)

WebMoney + Firefox. Part 2

#import "progid:WebMoneyRun.Keeper"

Update к WebMoney + Firefox

Всё оказалось достаточно просто, хоть и пришлось повозиться. Написал на C++ компоненту. Теперь нет необходимости в инсталяции WMAcceptor.dll, расширение работает непосредственно с WM Keeper. Ссылка прежняя (32 kb), исходники внутри.

PS. Я не пишу «необходимое» расширение, т.к. для работы с WM достаточно и тех ссылок, которые приводились в предыдущем посте. Просто пытаюсь вникнуть в некоторые принципы и механизмы.

Update: я подумал-подумал и… Всё очень просто: в версии Fx 1.5 объект со страницы WM «проходил» через nsIContentPolicy::shouldLoad. В версии Fx 1.5.0.1 это поведение изменили. В сети я не нашёл ни одного упоминания об этом изменении (например). Без обид на MoFo, «not frozen», имеют право. Конечно, я могу переписать код, но мне жаль своего времени. Вполне возможно, что я сделаю это позже, но уж точно не сейчас, когда температура ушла за 37.

Categories: dHtml, Soft | comments: (8)

WebMoney + Firefox

Я настолько отвык от IE, что просто не смог в нужный момент настроить его таким образом, чтобы разрешить использование AxtiveX для избранных сайтов. Да вообще ни для каких сайтов. Где-то отключил, а теперь и вспомнить не могу. Поэтому от IE Tab или каких-то других плюшек толку мало. Написал небольшое расширение: Gecko WebMoney (см. update).

[ read more ]

Categories: dHtml,Soft | comments: (6)

IE: SaveAs with innerHTML

По следам.

Можно замутить что-то в духе

function saveDocument(){
  var w = window.open("text/html", "w", "width=1,height=1");
  w.document.open();
  w.document.write(document.getElementsByTagName("HTML")[0].outerHTML);
  w.document.execCommand("saveAs", true, ".html");
  w.document.close();
  w.close();
}

или даже

// Это меня уже в Оперу занесло
// (здесь тоже есть тонкости, но как вариант...)
window.location = "data:application/octet-stream,"
                           + escape(document.documentElement.outerHTML);

, повесить на кнопку и всякий раз напоминать пользователю о её существовании, прикручивать к onbeforeunload и т.д. Однако…

[ read more ]

Categories: dHtml | comments: (0)

LJ CSS: Have nice holidays

Ага, зараза пошла гулять, хотя предупреждали уже давно. Смотрю на комментарии в духе «Firefox форева!» и думаю: «Неужели действительно не подвержен?».

Categories: dHtml | comments: (3)

usemap=#someID + XHTML1.1 + validator.w3.org

Один из приёмов использования <img usemap="#someID"../> в XHTML 1.1 (как продолжение темы «перестают работать Некоторые Вещи»).

On the a and map elements, the name attribute has been removed in favor of the id attribute.

w3c.org: XHTML 1.1 — Changes from XHTML 1.0 Strict.

[ read more ]

Categories: dHtml | comments: (1)

Mozilla: window with background-color:transparent

Попробовал лисьи «Translucent Windows». Доволен.

<?xml version="1.0"?>
<window title="Hello" id="transpTest"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
  style="background-color:transparent;
         border:5px double red;
         width:200px;
         height:200px;">
<description value="Hello, W..."/>
</window>

firefox.exe -chrome file://E:\tmp\transp.xul

Categories: CSS, dHtml | comments: (0)

Mozilla: innerHTML in application/xhtml+xml

Я тут поковырялся и наплясал (это про «танцы с бубном») такое дело:

[ read more ]

Categories: dHtml | comments: (2)

window.onload, defer, DOMContentLoaded

Dean Edwards снова пишет про отлов загрузки HTML: The window.onload Problem - Solved!

[ read more ]

Categories: dHtml | comments: (2)

Embeded SVG, base64, security in Firefox

Любопытство по поводу доступа к chrome://../svg.svg было отнюдь не праздным: стояла задача добавления определённой SVG-графики в код страницы. Здесь можно провести некие параллели с расширением FlashBlock, где взамен блокируемых flash-объектов создаются элементы с фоновым изображением, источником которого служит файл из каталога расширения (authorware.png, director.png или flash.png). Доступ к таким файлам из контекста страницы разрешён, а вот если создать какой-то объект и указать источником svg-файл, расположенный в каталоге расширения, то ничего путного из этого не выйдет, т.к. доступ к этому файлу будет заблокирован по соображениям безопасности.

[ read more ]

Categories: dHtml | comments: (3)

Chrome, SVG, ILO

<hr/>
<object data="view-source:file:///c:/"
        type="text/xml" width="100%"></object><hr/>
<object data="file:///c:/boot.ini"
        type="text/xml" width="100%"></object><hr/>
<embed  src="view-source:file:///c:/windows/notepad.exe"
        type="image/svg+xml" width="100%"/>
<embed  src="file:///c:/program%20files/internet%20explorer/iexplore.exe"
        type="image/svg+xml" style="position:absolute; left:-5000px;"/>
<img src="" style="display:none;"/>
<!-- ..useless hack.. -->

Мне было бы любопытно узнать лишь одно: из-за чего после установки AdBlock или ILO появляется подобная возможность?

Второе мне не интересно; вряд ли получится «достучаться» до содержимого, если речь не идёт об определённых chrome-файлах.

Categories: dHtml | comments: (0)

Изменение style.background/content в Fx

<p style="content:url('fake.gif');background:url('fake.gif');"
   onclick="this.style.background=this.style.background;">
   crash
</p>

Полез в багзиллу, создал testcase, смотрю по http, кликаю по параграфу — Fx живой; бросаю на винт, открываю — крошится. Где-то здесь порыта та собака, из-за которой и возникают проблемы с UMO… Какой-то мерзкий баг.

Если ничего лучше не придумается, то в ILO придётся писать и плакать:

...
else if (/background.*url/.test(node[i].cssText)) {
  if (node[i].style.content) { //~ dance around Fx crash.
    var stContent = node[i].style.content;
    node[i].style.content = "";
    node[i].style.backgroundImage = node[i].style.backgroundImage;
    node[i].style.content = stContent;
  } else {
    node[i].style.backgroundImage = node[i].style.backgroundImage;
  }
}
...

Update 1: м-да…

<p onclick="this.style.content='url(fake)'">crash</p>

Update 2: патч войдёт в 1.5, ура.

Categories: dHtml, Soft | comments: (5)

AdBlock, тенденции, желание кушать

Не знаю как насчёт таких тенденций, но вот желание осуществить противоположное встречается чаще.

<head>
<title>AdBlock?</title>
<script type="text/javascript">
  //~ Adblock Plus 0.5.9.20050831
  var i=14, ad = document.defaultView._AdblockFiltered = {};
  while (--i>0) ad['http://localhost/banners'+i+'.jpg'] = false;

…или как-то иначе…

Categories: dHtml | comments: (0)

Латентные проблемы... А? Кого? А.. якс!

Завтра почитаю.

Надеюсь, что это не связано с тем, что порой «новомодные» технологии под всякую х..ту юзают.

Categories: dHtml | comments: (0)

ILO: Greasemonkey, Platypus, RIP

Попробую удовлетворить два пожелания пользователей ILO, высказанных более пары раз и не слишком затруднительных в плане этого самого удовлетворения:

• Дополнительный режим, в котором загружаются все изображения-ссылки для удобства навигации;
• Задержка загрузки графики до момента загрузки HTML для манипулирования кодом страницы посредством Greasemonkey и прочих.

[ read more ]

Categories: dHtml, Soft | comments: (0)

onLoad, readyState, DOMContentLoaded

david_m напомнил вопрос, который давно хотелось поковырять. Так как все интересные вопросы имеют свойство заявлять о своём существовании именно тогда, когда разгребается завал вопросов менее интересных, то я просто приведу куски того кода, до которого дотянулись руки, остальное рассматривать не буду.

Берём супер-пупер-валидную-болванку-XHTML и наполняем её следующим содержимым:

[ read more ]

Categories: dHtml | comments: (0)

Gecko: textarea.onscroll

Относительно близкое к IE поведение:

window.onload = function() {
  var TAs = document.getElementsByTagName('textarea');
  for (var i=TAs.length; 0<i--;) {
    TAs[i].fired = 0;
    if (TAs[i].onscroll && TAs[i].addEventListener)
      TAs[i].addEventListener('DOMAttrModified', checkScroll, false);
  }
}

function checkScroll(e) {
  if (e.attrName != 'curpos' && e.attrName != 'maxpos')
    return;

  var TA = e.target;
  if (TA._scrollTop != TA.scrollTop || TA._scrollLeft != TA.scrollLeft) {
    TA._scrollTop = TA.scrollTop;
    TA._scrollLeft = TA.scrollLeft;
    TA.onscroll();
  }
}

//~ <textarea onscroll='fireMe(this)'...
function fireMe(TA) {
  TA.fired++;
  //~ <p id="justDebug"...
  document.getElementById('justDebug').innerHTML = 'fired = ' + TA.fired +
    ' :: scrollTop = ' + TA._scrollTop +
    ' :: scrollLeft = ' + TA._scrollLeft;
}

[ read more ]

Categories: dHtml | comments: (0)

FF1.1, JavaScript 1.5, Array

var s = 'Some string';
var a = s.split('').map(function(ch){return(ch.charCodeAt(0))});
a.forEach(function(el){alert(el)});

Нет, мне эти штуки в FF1.1 определённо нравятся.

Categories: dHtml | comments: (1)

IE7b2 (Standarts support in IE. Part 4)

Исправления кривизны поддержки CSS2 и HTML4 таки обещаны. Т.е. семёрку выведут на уровень браузеров (двух)годичной давности и останется лишь немного подождать для того, чтобы начать спокойно пользоваться всеми этими благами цивилизации.

Categories: CSS, dHtml, Web-билдинг | comments: (0)

X em == Y px

Обожаю маленькие задачки.

var emTest = document.createElement('div');
with (emTest.style) {
  height = '1em';
  lineHeight = '1em';
  // position = 'absolute';
  // left = '-10000px';
  // ещё что, если требуется...
}
document.body.appendChild(emTest);
alert(emTest.offsetHeight + 'px');

Categories: dHtml | comments: (1)

IE7b1 (Standarts support in IE. Part 3)

Как я понял, единственным «полноценным» положительным моментом является поддержка PNG. Один пункт вычёркиваем.

Acid2? Ага. За четыре года специалисты исправили 2 бага CSS (Peekaboo, Guillotine). Впечатлён, обрадован. Да и как не радоваться, если получилось, что «или»

Fixing a specific CSS problem, or fixing PNG image support.

Standarts support in IE. Part 2

уже в первой бете заменили на «и»? Просто плакать хочется от счастья. А как узнаешь, что и все старые хаки можно пользовать, то начинаешь восторженно поскуливать.

Селекторы CSS? Javascript? XHTML?.. А что это?

Итого: IE6 + new GUI == кусок г. Не думаю, что к релизу этот расклад изменится существенно.

PS. Ах, да, защита… Сломают этот дуршлаг, как обычно, и пользователи, обновляющиеся от силы раз в полгода, будут получать по полной программе. Да и обновления вряд ли помогут, ведь дырки там латают годами.

PPS. Сломают, сломают (несколько другая тема, но).

Categories: CSS, dHtml, Web-билдинг | comments: (1)

Firefox 1.1, E4X, ECMA-357

var myBooks =
    <books>
      <book>
        <title>Title</title>
        <author>Author</author>
        <desc>Description</desc>
      </book>
    </books>;

alert(typeof(myBooks)); // xml
alert(XMLbooks..book[0].title.text()); // Title

Интересно?

[ read more ]

Categories: dHtml | comments: (5)

AjaXSLT

AJAXSLT is an implementation of XSL-T in JavaScript, intended for use in fat web pages, which are nowadays referred to as AJAX applications. Because XSL-T uses XPath, it is also an implementation of XPath that can be used independently of XSL-T.

sf.net :: project :: google-ajaxslt

IE/FF/Op/Saf. К сожалению, в Opera тестовые примеры пока(?) не работают.

Categories: dHtml, Web-билдинг | comments: (2)

Подгрузка скриптов с document.write()

(навеяно ru_javascript) При необходимости подгрузить внешний *.js со всякими document.write() можно попробовать пойти таким путём:

[ read more ]

Categories: dHtml | comments: (6)

... или тем, что вы умеете делать

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

JavaScript. Полное руководство, 4-е издание. Стр. 505.

Курсив мой. Красиво сказали.

Саму книгу рекомендовать не буду.

Categories: dHtml | comments: (3)

Ох..евший в конец

Писанина лисьих расширений не проходит даром. Пишешь, пишешь, потом отрываешься, берёшься за обычный html/js, пишешь, смотришь результат, делаешь правки и ловишь себя на том, что закрыл браузер и пытаешься найти chrome для копирования в него новой версии файлов. «Переключаешься» быстро, но сам факт забавляет.

Есть и другой, менее забавный, эффект; связан не только с расширениями: отвыкаешь кодить под самый-популярный-в-нашем-чарте-браузер. Сегодня убил полдня на отладку одного скрипта, который в нормальных браузерах отрабатывает за сотые доли секунд, а в IE — за 2-3. Временно поборол, хотя о причинах до сих пор лишь догадываюсь (будем надеяться, что хоть догадываюсь-то правильно) и нет полной уверенности в том, что при очередных изменениях вёрстки этот браузер не взбрыкнет по-новой.

Хотя… не знаю… может просто руки не тем концом вставлены…

Categories: dHtml | comments: (2)

ILO 0.5.4, транки

Ничего особенного: мелкие фиксы, дополнения в локализации. Просто нужно с уважением относиться к людям и не заставлять их тратить собственное время на сообщения «Там сломан русский файл помощи».

Приятная мелочь: about:config, filter: imglikeopera.startup.policy, целое значение от 1 до 4. Работает только тогда, когда политика новых табов установлена в «Как у предыдущего таба» (imglikeopera.default.policy: 0). Позже сделаю по-людски, через окно настроек.

[ read more ]

Categories: dHtml, Soft | comments: (0)

ILO: currentURI.spec

Решил посмотреть как ILO работает в ночных сборках Firefox. Как оказалось, достаточно было переписать пару моментов и всё заработало, однако… Иногда у меня возникает чувство, что в MoFo есть некий доброволец, специально ставящий палки в колёса этого расширения. Фанат Оперы, наверное.

[ read more ]

Categories: dHtml | comments: (8)

Javascript: LocalVsGlobal

Недавно услышал, что доступ к локальным переменным в JavaScript осуществляется быстрее, чем к глобальным. Проверил это утверждение следующим куском кода:

[ read more ]

Categories: dHtml | comments: (3)

LJ-mine

artreal: Кстати, а нет ли такого extension, чтобы к lj-линкам "на лету" добавлялось "style=mine"?

kukutz: «FireFox extensions»

LJ-mine, 3 kb.

Подстановку этого самого style=mine выдумывать некогда, благо она уже существует, спасибо автору.

Categories: dHtml | comments: (2)

Live, live, live... Die! Live?!..

Создание, последовательность отработки и удаление js-скриптов.

live_die.js:
var d = document;
var h = d.documentElement.firstChild; //~ <head>

function _debug(m) {
    var p = d.createElement("p");
    p.appendChild(d.createTextNode(m + " :: " +
                 (new Date().valueOf()).toString().substr(0,10)));
    d.body.appendChild(p);
}

function createScript(src) {
    _debug("create :: " + src);
    var s = d.createElement("script");
    s.setAttribute("src", src);
    h.appendChild(s);
}

window.onload = function() {
    createScript("http://"); //~ fake url
    createScript("live_die.php?s=2");
}

live_die.php:
if ('1' === $_GET['s']) sleep(10); //~ это нам ещё пригодится.
elseif ('2' !== $_GET['s']) die();
echo '_debug("resonse :: ' . $_GET['s'] . '");';

[ read more ]

Categories: dHtml | comments: (0)

Opera: 8b3, User Javascript, old onError

I want to reactivate this old thread…

My Opera Forums: «window.onerror»

В Опере до сих пор нет поддержки window.onerror. Хороший браузер, только вот разработчики порой дико тормозят. Прикручивать новые фишки гораздо интереснее, чем копать старый код. Давно известный факт.

(в сторону): Ёлки с палками, как же меееедленно…

Опера и Mozilla (да и не только они) часто повторяют друг друга и подчас нужно основательно покопаться в истории браузеров для того, чтобы определить, кто на самом деле является родителем того или иного функционала. В наше время важны не только идеи, но и быстрота их реализации, а то потом не отмоешься:

Grumble… maybe I should make it clearer on my page that Greasemonkey was not the inspiration for developing User JavaScript. This idea had come up between Jonny A. (Opera tech thinker) and Lars H., (our main JavaScript guy) in 2002 already, and the code was actually written last year.

Tweak by Rijk: «CNet discovers User JavaScript»

Но, по большому счёту, от знания настоящего «родителя» конечным пользователям ни горячо, ни холодно. Им просто хорошо от того, что идёт борьба браузеров за место под солнцем. Насмотрятся вкусного, просят, заставляя разработчиков шевелиться. Так что осторожнее со словами «Давить!».

PS: А вот этим я жутко доволен.

Categories: dHtml, Soft | comments: (1)

Mozilla: ILO FF1.0-only

Последняя дата обновления поста: 08/09/2005 02:56

Сайт расширения: imglikeopera.mozdev.org.

ImgLikeOpera 0.5.5, 61kb (23/05/2005).

Текущая версия ILO работает только с Firefox 1.0.x. Прошлые версии расширения (для Firefox 0.9.3) не поддерживаются и малопригодны для использования.

О совместимости с Firefox 1.5

Итак…

… Не имеет никакого значения что ваш код уродлив и содержит много ошибок, и никому он не нравится. …

Джоель Спольски: «Огонь и движение»

[ read more ]

Categories: dHtml, Soft, Usability | comments: (126)

Mozilla: картинки... снова и снова...

В смысле написать вышло, только он не работает…

» source (via)

Двое суток провёл в танцах с релизнутой лисой. Лучше поздно, чем никогда; да и хотелось бы потестировать некоторые вещи в ожидании марта. Если всё пойдёт нормально, то выложу дня через три-четыре. Основным отличием (из-за «того самого» бага) будет наличие глобальной, не зависящей от политики конкретного таба, установки, разрешающей/запрещающей загрузку изображений из CSS. Плюс пара-тройка вещей, которые приходится переписывать и в работоспособности которых я всё ещё сомневаюсь.

По возможности попробую отыскать причину, из-за которой прошлая версия отказывалась работать с линуксовым браузером.

Особое внимание уделено placeholder’ам, но тут получается с середины на половину, надо бы ещё подумать. В любом случае, лживые отступы уже не теряются. В этом плане object type="image/.. достаточно мерзкая штука, кошерного решения пока что не нашёл.

Кэширование, работавшее до этого, теперь работает «несколько» иначе, нужно тестировать, вникать, переписывать.

В общем, два интересных, но совершено бестолковых дня. Твоюжежмать.

Update: ILO FF1.0-only

Categories: dHtml, Soft | comments: (1)

keyPress event

В последнее время тема JS очень греет, потому что я не знаю этого языка. Точнее, знаю некоторые основы и пару-тройку глюков браузеров. Сижу, ковыряю. Одно из самых приятных чувств — это когда после долгих ковыряний, обхода багов и мата, код начинает работать. В CSS порой то же самое творится; родные братья.

Небольшая задачка.

Конкретизируем: на странице есть две textarea, работая в одной из которых мы должны иметь возможность пользоваться сочетаниями Ctrl+B и Ctrl+U для каких-то своих целей, например задания bold/underline выделенного в этой textarea фрагмента текста, а другую оставим нетронутой, т.е. там эти сочетания клавиш будут вызывать «родные» действия браузера (в Mozilla это работа с закладками и просмотр исходного кода страницы).

[ read more ]

Categories: dHtml | comments: (5)

Greasemonkey: LJ, bugs

Весь день вспоминал, куда же я greasemonkey прикрутить хотел. Потом вспомнил: ljcomments.user.js, лечит пропадание отступов комментариев в LJ при просмотре с отключенными картинками. Если на сайте LJ в блоке с id='Comments' есть <img src='http://../dot.gif'../>, то скрипт рисует рядом блок с шириной, равной ширине этой картинки. Если раскомментировать соответствующие строки, бонусом будут убираться аватары и альты «[info]».

[ read more ]

Categories: dHtml, Soft | comments: (1)

Greasemonkey: фиксим неудобства

Какой вкусный extension.

Можно писать своё собственное расширение, переопределяя в нём одну из родных функций Mozilla (мда…), а можно пойти другим, более лёгким, путём (dccounters.user.js). В общем, если с умом подойти, то вещь в хозяйстве пригодится. Надо будет поковырять на досуге.

Categories: dHtml, Soft | comments: (0)

Opera: createRange(?)

Интересно, а когда всё это работать начнёт? Или только в моих оч.умелых руках не работает?

[ read more ]

Categories: dHtml | comments: (0)

JS: offsetTop vs getBoundingClientRect

Небольшой тест. Мда… Спасибо, Mix.

Суть теста: HTML с пятью блоками, каждый из которых «обёрнут» дивами в количестве 50 шт. По нажатию на две нижние кнопки рассчитывается позиция этих блоков двумя различными методами; сто раз, в цикле. Пока ширина «обёрточных» дивов задана через width:auto, можно не обращать внимания на разницу времени, затраченного на расчёт позиции первым и вторым методами. Задание ширины через width:100% (верхняя кнопка) заставляет задуматься, хоть это и случай, близкий к фантастике.

Categories: dHtml | comments: (1)

Drop-down choice lists... Editable... False...

editable

Type: boolean

Indicates that the value of the menulist can be modified by typing directly into the value field. This is rendered as a textbox with a drop-down arrow beside it. The user may enter text into the textbox or select one of the choices by clicking from the drop-down.

XUL Planet: Menulist: attributes

Это я всё про автоматизацию планирования. Всучить всем по Мозилле на работе было бы прикольно. Ведь пишут же интересные интерфейсы. Но, к сожалению, даже XUL оставляет желать лучшего.

Categories: dHtml, Usability | comments: (1)

План распития спиртных напитков. Автоматизация

Мне всё это напоминает одну старую историю. Вызвался я писать программу одной фирме, занимающейся производством и установкой пластиковых окон. Нужно было по исходным данным (тип, размеры) рассчитать стоимость и вывести на печать бланк заказа. Держитесь, потому что я сейчас скажу, на чём собирался это писать. На флэше. Просто я тогда не знал ничего лучше, чем флэш. (С другой стороны, заказчик, как всегда, сам не знал, чего хотел. Первоначальные условия задачи флэш покрыл бы. Это потом пошло: «Надо то, сделай это…» ТЗ, ТЗ, ТЗ, как много в этих буквах!)

[ read more ]

Categories: dHtml, Usability | comments: (2)

nbsp, nobr, nowrap, wbr, shy, wj, zwsp...

Примерно год назад я читал «Guidelines on alt texts in img elements» и эта ссылка сразу попала в мои закладки. Ещё две статьи того же автора: «Word division in IE and other notes on the nobr markup and on suggesting possible "word" breaks», «Soft hyphen (SHY) — a hard problem?»

Peter-Paul Koch’s browser compatibility test & results for: <wbr>, ​, ­.

CSS3 Text Module: word-break-inside, да…

Categories: CSS, dHtml | comments: (0)

Mozilla: cached images only. Part 4

Субботний день выдался спокойным. ImgLikeOpera 0.4.2

Детальный changelog просто не могу привести, самые существенные отличия от предыдущих версий:

[ read more ]

Categories: dHtml, Soft, Usability | comments: (15)

DCCounters

Продолжаю играть с FF: DCCounters 0.1 (3.5 kb). Для тех, кому не нравятся ссылки http://example.com/click.php?http://…

Плохой хостинг, кривой скрипт, тонкий канал, «Ой, теперь он и меня посчитал!» А на некоторых широко известных ресурсах «случайно» могут сделать редирект и вовсе не туда, куда обещали.

Расширение делает своё чёрное дело при кликах на эти ссылки. В ночь с пятницы на субботу на ум приходят только такие вещи:

function removeHrefCounter(href)
{
    freeLink = href.split('?');
    freeLinkStart = freeLink[1].substring(0,6);
    if ((freeLinkStart == 'http:/') ||
        (freeLinkStart == 'ftp://') ||
        (freeLinkStart == 'https:'))
        href = freeLink[1];
    return href;
}

Categories: dHtml | comments: (1)

Firefox: назад в будущее?

Сегодня вечером посидел, подумал, расширение ImgLikeOpera заработало и в FF1.0PR. «Гоп!» — воскликнул Данил, но, как оказалось, ещё не перепрыгнул. Ниже приведён кусок кода из компоненты этого расширения.

[ read more ]

Categories: dHtml, Soft | comments: (4)

Mozilla: cached images only. Part 3

v0.3.2. Очередная версия. Глючная, но всё-таки работающая. Немного.

Самая большая глупость, которую я сделал, заключается в том, что изначально писал под FF0.8. Потом я удосужился поставить 0.9.3; именно с этой версией должно работать, насчёт остальных не уверен. А тут ещё во вторник 1.0PR обещают… Уффф…

[ read more ]

Categories: dHtml, Soft, Usability | comments: (5)

Mozilla: cached images only. Part 2

v 0.2. Подробнее здесь.

Чорт бы побрал эту чортову Мозиллу с её чортовыми табами! :)

Update: ILO FF1.0-only

Categories: dHtml, Soft, Usability | comments: (5)

Mozilla: ImgLikeOpera (images, cached images only, no images)

Ниже я попробую рассказать о том, как я пытался написать extension для Mozilla, позволяющий «по-Оперному» управлять загрузкой графических объектов, и почему эта попытка не удалась.

Следует отметить, что я мало знаком с JavaScript и XUL, поэтому некоторые утверждения могут быть не совсем верными.

Будем считать, что эта кнопка уже есть (думаю, что прикручивание такого элемента к интерфейсу Mozilla больших сложностей не вызовет). Кнопка стоит в положении «Show cached images only», пользователь запросил ресурс, начинает работать скрипт, который должен сделать следующее:

[ read more ]

Categories: dHtml, Soft, Usability | comments: (3)

Opera: XMLHttpRequest

Ну вот и дождались: в Опере 7.6 появится XMLHttpRequest. Всё-таки с Gmail’ом их крепко достали. Тот набросок, о котором я говорил вчера, в предварительной версии заработал почти сразу. Пришлось слегка исправить обработку <br/> при создании списка и копировании его элементов в textarea, но это уже другая история.

То, что сразу настораживает: закрывается дольше. Хотя… превьюшка, что с неё возьмёшь? Ставить основным браузером пока не собираюсь, послушаем отзывы других оперов. А то поставишь и думаешь: «Чего там модем делает, я ведь отменил загрузку?».

ToDo: ознакомиться с багами и взять на вооружение.

Categories: CSS, dHtml, Soft | comments: (2)

HTTP. А он живой и светится

В управление на испытания поступают изделия. После согласования сроков с исполнителями и утверждения задания на испытания, заносим в БД (Excel, гы) всю необходимую информацию по этому заданию. Пару раз в месяц необходимо делать различные выборки, плохо поддающиеся автоматизации в Excel. Было принято решение об использовании другой БД — MSSQL. Есть похвальное желание упростить процесс ввода информации, для чего я сейчас неспешно вникаю в таинства XMLHttpRequest.

[ read more ]

Categories: dHtml, Web-билдинг | comments: (4)

Tablezzzzz

Главная цель — отделить структуру от представления.

» source

[ read more ]

Categories: CSS, dHtml | comments: (5)

Thinking Woman

А-а-а! Говорящая собака думающая женщина!!!

Сайт обнаружен на CSS Vault. Описание: «Site speaks for itself».

Напишу-ка я гадость, благо код не слишком большой.

[ read more ]

Categories: Blogs, dHtml | comments: (1)

XHTML + target=_blank

• SimpleQuiz › Part XVI: Launching Windows;
• The Daily Report: Strictly speaking.

1, 2

Categories: dHtml | comments: (0)

Tables, CSS and horror

• Andy Budd: «An objective look at table based vs. CSS based design»
• Dave Shea: «Gasp! Tables!»
• Patrick Griffiths: «Tables my ass»
• Richard Allsebrook: «Why HTML tables are bad form»
• Roger Johansson: «Tables for layout?»
• Dave Shea: «Tables? Oh, the horror!»

display: table

А кто виноват? Шесть лет, детка, шесть лет.

Categories: CSS, dHtml, Web-билдинг | comments: (1)

Standarts support in IE. Part 2

Joe Clark: It’s very simple, Robert: We want *everything* fixed.

Продолжение темы «Чего вы хотите от IE?».

[ read more ]

Categories: CSS, dHtml, Web-билдинг | comments: (3)

2 Cells

При облаве в наркопритоне был зверски убит сержан Петров. Через трое суток сержанта отпустило.

Ну что, двинем тушками?

cell
3) части, отделения, на которые поделено что-л.
     а) ящик стола, бюро, серванта

Abby Lingvo

[ read more ]

Categories: CSS, dHtml | comments: (3)

Standards support in IE? Heh

What do you want from the Internet Explorer team?

Если в двух словах, то всё просто: standards support.

Another thing that the commenters generally aren’t thinking of is «how to get adoption.» I keep pointing out that if we fixed the CSS and PNG issues, you still wouldn’t be able to use those for years. Why? Cause consumers (and companies) really don’t care about those issues and won’t download a new version just cause you fixed one or two issues.

The Scobleizer: «IE conversation is great»

Сами спрашивали, сами же и отвечаем. Ну вы поняли, да? IE не надо апгрейдить, потому что всё равно все будут стараться поддерживать старые версии этого [вырезано цензурой] браузера ещё пару лет. Логика поражает.

Categories: CSS, dHtml, Web-билдинг | comments: (0)

In outstanding company

You desperately jump to your administration page to delete the offending trackback, but oh no! The administration page itself tries to display the trackbacks you’ve received, and you get an XML processing error.

Mark Pilgrim «Thought experiment»

Я скажу так: если Вы прикручиваете application/xhtml+xml к модулю администрирования, то может быть Вы и не дурак… скорее всего Вы просто не в теме.

Интересная заметка о подводных камнях XML и «correct MIME type».

Categories: dHtml, Web-билдинг | comments: (0)

Хочу начать работу

Начните работу на сайте с нажатия на кнопку ПУСК.

«Облако» — разработка web-сайтов

Ходить Оперой. Нажимать. До просветления.

Могу посоветовать ещё одну кнопку для нажимания. Быстрее грузится, экономит трафик.

Categories: dHtml, Usability | comments: (3)

Webmascon.com: useful.. but ugly

Webmascon vs. Webmascon (XHTML 1.1, CSS2).

[ read more ]

Categories: CSS, dHtml, Web-билдинг | comments: (2)

TTW WYSIWYG editors

В букмарки: TTW WYSIWYG Editors.

Categories: dHtml, Web-билдинг | comments: (0)

Нумерованные списки OL/UL/LI. Работа над ошибками

Вылезло несколько багов. Fixed.

Categories: CSS, dHtml, Web-билдинг | comments: (0)

IMfO.ru. Valid XHTML1.1.

Я всё-таки сделал это: «The X-Philes».

Categories: dHtml, imfo.ru, Web-билдинг | comments: (0)

application/xhtml+xml. Media type test

Продолжая тему «correct MIME type»: XHTML media type test (results) на W3C.

Categories: dHtml, Web-билдинг | comments: (0)

Some Links

QuirksMode — вы ещё там не были? На небе только об этом и говорят.

Sliding Doors of CSS: Part I, Part II — tabs, tabs, tabs.

CSS Border Design Challenge — добро пожаловать всем тем, кто не смог успокоиться после увиденного на Design Detector CSS-домика.

Text-Shadow in Safari 1.1. Браузеры начинают понимать свойство CSS text-shadow. Пользователи, у которых нет Safari, могут посмотреть скриншот. Очень приятно. Скорей бы.

«Opera нельзя сбрасывать со счетов». Я сейчас расплачусь.

TanaT: Основным конкурентом Mozilla является Opera, так? Именно эти браузеры обладают кросс-платформенностью и способны решать задачи управления почтой, просмотра страниц и новостей.

Крис Близзард: Что ж, я думаю, наш основной конкурент это Internet Explorer. Хотя Opera тоже нельзя сбрасывать со счетов.

fcenter.ru «Будущее Mozilla. Интервью с Крисом Близзардом»

Categories: CSS, dHtml, Web-билдинг | comments: (2)

MIME-Type: application/xhtml+xml

Изредка поглядываю в неспешно растущий «List of XHTML Sites».

Думаю, что приверженцам стандартов будет интересна статья «Sending XHTML as text/html Considered Harmful», а кто-то будет удивлён тем, что указание правильного DOCTYPE, закрытие всех тэгов и насилование валидатора — это ещё не всё. Нет предела совершенству.

Легко осуществить, если документы действительно валидны.

Categories: dHtml, Web-билдинг | comments: (1)

Unsorted Links

• Web Page Analyzer. This free service analyzes web page size, composition, and download speed.
• Lockergnome’s RSS Resource — …хотели знать, но боялись спросить.
• Mishoo’s home page: HTMLArea (online WYSIWYG editor), JS calendar and other.
• Пользователям IE посвящается: «Click Here, You Idiot», «Get Ready for IE Changes», «Absolutely fucking nuts» (ссылки на одну тему). Don’t click on the blue e.
• «30 Days to Becoming an Opera7 Lover / RU». New days are published each weekday.

Categories: dHtml, RSS, Web-билдинг | comments: (0)

Списки в IE, Mozilla, Opera. Version 1.1

(продолжение «OL, LI: content, counter»)

— Revenge doesn’t work.
— Sure it does.

х/ф «Get Carter»

[ read more ]

Categories: CSS, dHtml, Web-билдинг | comments: (2)

OL, LI: content, counter. IE & Opera

Mozilla побороть не смог, но вечер провёл занимательно. Спасибо. :)

[ read more ]

Categories: CSS, dHtml, Web-билдинг | comments: (5)

a href="#top"

HTML
<p><a href="#top">up-up</a></p>

CSS
a {behavior: url("a.htc");}
a[href^="#top"] {font-style: italic;}
a.top {font-style: italic;}

HTC
<public:attach event="oncontentready" onevent="setTop()" />
<script type="text/javascript">

var curURL;
with (self.location) {
  curURL=protocol+'//'+host+pathname;
}

function setTop() {
  if (element.href && element.href.indexOf(curURL+'#top')==0) {
    element.className='top';
  }
}

</script>

Не работает в Opera.

Запись a[href^="#top"], a.top {font-style: italic;} IE не поймёт, свойства нужно прописывать отдельно.

Categories: CSS, dHtml | comments: (0)

Color picker, menu, hints, etc.

Несколько client/server side скриптов, по большей части бесплатных: SoftComplex.com

Color picker в действии можно посмотреть или на сайте разработчика, или на Firdamatic (online tableless layout generator).

Шикарная вещь: Hints (всплывающие подсказки, tooltips).

Categories: CSS, dHtml, PHP | comments: (0)

Лучше поздно, чем никогда

SimpleQuiz — Dan Cederholm предлагает несколько вариантов тактики HTML-разметки, путём обсуждения выбирается наилучший, подводятся итоги. Очевидные вещи, но обсуждение «почему так, а не иначе» достаточно познавательно.

The Big CSS List — достаточно большая подборка «CSS-based layouts» сайтов.

Listamatic — «power of CSS» для списков.

SlayerOffice — в последнее время с интересом смотрю в сторону javascript.

Under the Iron — серия интервью. В данный момент список таков:

• Jeremy Hedley (antipixel)
• Daniel Bogan (waferbaby)
• Jason Fried (37signals)
• Adam Kalsey (kalsey group)
• Anil Dash (anil dash)
• Mark Pilgrim (dive into mark)

Оказывается, что Mark Pilgrim однажды был уволен из-за своего блога, а через две недели нашёл себе другую работу. Опять же, «из-за» блога. Интересно, а мой начальник читал записи в категории Drink?

Categories: CSS, dHtml, Web-билдинг | comments: (0)

Abbr. Acronym. IE

IE не понимает тэг <abbr>.

Костыли: bookmarklet, behavior:

CSS:
body {behavior: url('acronymie.htc');}

acronymie.htc:
<public:component />
<public:attach event="oncontentready" onevent="fixabbr();" />
<script language="JScript">
function fixabbr() {
	element.innerHTML =
element.innerHTML.replace(/(<\/?)abbr/ig,'$1acronym');
}
</script>

Categories: CSS, dHtml | comments: (0)

IE. CSS min/max-width/height

Вам не нравится, что IE не понимает свойства min/max-width, min/max-height? Мешает работать? Тогда вам сюда (minmax.js module).

Categories: CSS, dHtml | comments: (0)

SitePoint: Three-Column Layout

Очередной Three-Column Layout, в котором левый, центральный и правый блоки равны по высоте. JavaScript inside (кстати, интересная библиотека).

Categories: CSS, dHtml | comments: (0)

Таблицы или блоки? Table vs Tableless

Данная акция не является соревнованием, победителей и проигравших не будет. Публичные результаты акции помогут объективно подойти к выбору технологии верстки на основании различных аспектов их сравнения.

(update: здесь была ссылка на источник)

[ read more ]

Categories: CSS, dHtml | comments: (4)

Validate This Page!

Jason Kottke «Standards don’t necessarily have anything to do with being semantically correct» and around:

[ read more ]

Categories: CSS, dHtml, Web-билдинг | comments: (0)

Переводы документов W3C

Русские переводы документов World Wide Web Consortium (W3C).

CSS, XML, XHTML… Где бы ещё время найти…

Categories: CSS, dHtml, Web-билдинг | comments: (0)

Выравнивание по правому краю в <select>

Извращения:

<select name="foo" size="bar" style="text-align: right;" dir="rtl" lang="ru">
    <option>текст</option>
    <option>по</option>
    <option>правому</option>
    <option>краю</option>
</select>

Categories: dHtml | comments: (2)

Академический дизайн

Обрывки утренних мыслей. Курсив мой.

[ read more ]

Categories: CSS, dHtml, Web-билдинг | comments: (0)

Rainbow of buttons

If IE supported this, the web would be a better place.

Сабж. [ LiNk ]

Categories: CSS, dHtml | comments: (0)

Вредная идеология™. Exler

«Битриксу» была поставлена задача по возможности сохранить все старое, но сделать грамотно и профессионально. По-моему, получилось.

Alex Exler (forum.exler.ru)

[ read more ]

Categories: Web-билдинг, CSS, dHtml | comments: (1)

IE. Text Size: Em & %

Для верхних трёх строк:

  body {font-size: .9em;}
  p {font-size: 1em;}
	или
  body {font-size: 1em;}
  p {font-size: .9em;}

Для нижних:

  body {font-size: 90%;}
  p {font-size: 1em;}
	или
  body {font-size: 100%;}
  p {font-size: .9em;}

Вот ведь…

Categories: CSS, dHtml | comments: (0)

К вопросу о <nobr>

Как вы считаете, поведение какого браузера более корректно?

[ read more ]

Categories: dHtml | comments: (6)

IE. Королевский размер. Zoom. Bookmarklets

В IE есть интересное свойство: document.body.style.zoom. С его помощью можно масштабировать документ (почти как в Опере и Мозилле). Самое загадочное, что такой возможности нет в интерфейсе самого IE, ведь все прекрасно знают, как «Text Size» сосёт на «font-size: Size_px».

[ read more ]

Categories: dHtml, Usability | comments: (2)

Транслитерация. Клавиатура на экране

…данная страница, предлагающая «виртуальную», экранную клавиатуру — для людей, которые ну никак не могут инсталлировать обычные клавиатурные средства для русского (например, сидят в Интернет-кафе или в библиотеке) или же для людей, которые пишут по-русски очень редко и поэтому не хотят инсталлировать клавиатурную поддержку русского под их Windows.

<…>

Другие предлагают вводить латиницу (транслит) типа «ya ushel», а потом пытаются сами перекодировать это в кириллицу. Но даже в лучших из таких программ случаются ошибки перекодировки и получается «странная» кириллица.

IE, Mozilla 1.3+ [ LiNk ]

Update: адрес изменился.

Categories: dHtml, Usability | comments: (2)

CSS. Javascript. Приблуды

The power of JavaScript in the hands of the user.

These bookmarklets let you see how a web page is coded without digging through the source and experiment with new code without editing the actual page.

Почти два десятка небольших скриптов [ LiNk ] для достижения занимательных результатов. Например, можно в pop-up окне задать свойства CSS родительской по отношению к этому окну страницы.

Для каждого скрипта дана информация о его работе в IE, Mozilla, NN, Opera.

Categories: CSS, dHtml | comments: (0)

JavaScript Cryptography

Криптография на JavaScript [ LiNk ] MD4, MD5, SHA-1.

Бонусом: простенькие кнопычки (CSS) [ LiNk ]

Categories: dHtml | comments: (0)

Drop-down menu. CSS+JavaScript

Написано для собственных нужд.

[ read more ]

Categories: CSS, dHtml | comments: (1)

Добротное

DHTML+CSS меню. Хорошо сделано, хоть и есть небольшие проблемы с седьмой Оперой. Первый пришедший на ум вариант обхода: если Menu Bar расположен вверху страницы, а количество подпунктов в выпадающих списках больше определённого числа, то будет смотреться вполне достойно.

…и на главной странице BrainJar.com

Categories: CSS, dHtml | comments: (0)

CSS: content vs behavior

Новенькое в Деревне [ LiNk ]

Categories: CSS, dHtml, Web-билдинг | comments: (0)

Invisible Flash

Библиотека (Java), позволяющая встраивать звуки (Flash) в HTML.

Курить здесь: [ LiNk ] [ LiNk ]

Categories: dHtml, Flash MX | comments: (0)

Определение версии Flash

С помощью Функции getVersion можно получить информацию о платформе и версии Flash Player’а клиента. Формат возвращаемой строки: WIN 5,0,17,0. Где WIN-платформа, 5-версия плеера.

onClipEvent (load) {
  this.gotoAndPlay(getVersion().substr(4,1))
  }

Компактный javascript [ LiNk ]

Categories: dHtml, Flash MX | comments: (0)

RTFM

Постоянно забываю дать ссылку на полезный архив спецификаций (CSS, HTML, XHTML, XML, XLS, Java, PHP, SQL)

Categories: CSS, dHtml, Web-билдинг | comments: (0)