Чудо{вищные} заметки

Update: 06.11.08
ЕЩЁ раз обращаю внимание тех, кто бездумно скопирует и будет использовать приведённый рецепт (судя по количеству почитателей этого поста, сектантов культа Режь-Клей тьма) – если вам нужен border-spacing: 0, прочитайте ДО КОНЦА, а лучше сразу последнюю строчку.

Делюсь грязным хаком, для добавления поддержки border-spacing в IE. Собственно сам css:

table {
border-spacing: 50px; /* для всех кто в теме */
scrollbar-face-color: expression( runtimeStyle.scrollbarFaceColor = '#fff', cellSpacing = parseInt(currentStyle['border-spacing'])); /* угадайте кто?*/
}

Ну и пояснения: суть кода думаю ясна – вместо border-spacing, задать аналогичный cellspacing. Единственный (на мой взгляд) недостаток – считаю что border-spacing задан в px. Желающим поизвращаться поупражняться в переводе из других единиц – милости прошу.

Ну и вкратце о магический пассах, которые сплетены вокруг рабочего кода – они нужны для того чтобы expression выполнился ровно один раз (любопытным предлагаю заменить в вышепреведённом заклятье runtimeStyle… на alert(“Интересно как же часто я покажусь?”) ).

А за разъяснениями о runtimeStyle, currentStyle и разнице между ними отправляю к источнику сей мудрости – докладу о “тонком css” для IE с Client Side’2007.

Update: описанный хак нужен лишь в случае если border-spacing отличен от нуля, в противном случае используется border-collapse: collapse.

Update 20.03.2009 Почему перестало работать в IE8 ?

Аллилуйя! Это-таки случилось. M$ получила лицензию от Eolas на метод внедрения медиа-контента на html-страницу. Назойливое сообщение уйдёт известным путём в известном направлении. Где-то в декабре эту мерзость можно будет убрать путём скачивания виндового апдейта. Ну а в апреле обещают xp sp3, который окончательно удалит эту мозоль. Поздравляю всех “затронутых”.

первоисточник

Technorati Tags: flash, swfobject, ieupdate, activex

Выдам ещё одну порцию фактов, связанных с jQuery.

• jQuery.get() и jQuery.post() принимают последним четвёртым параметром dataType. Ну принимает и бог с ним, скажут некоторые. А другие смогут этот факт использовать во благо. Вот пример такого “блага”:
  $.post(backend_url,params,callback,’script’); // и вуаля – все вернувшееся с бэкэнда интерпретируется как javascript.Опять-таки внимательный (и просвещённый) читатель скажет “ну и нафига? есть же jQuery.getScript ?”. Тут мне ответить уже нечего. Разве что напомнить о том факте, что getScript передаёт параметры GET-ом, длина которого как мы знаем весьма ограничена.
• Кстати о jQuery.getScript() – начиная с версии 1.2.1 getScript умеет кросс-доменные запросы (все урлы начинающиеся с http автоматом будут тянуться не через XmlHttpRequest, а посредством добавления тега script). Это открыло нам такие просторы, что ни в сказке сказать, ни трактором убрать… (правда имеется одно досадное недоразумение, но видимо оно беспокоит только меня UPDATE: пофиксили).
• Не совсем jQuery, но тоже важный факт – расчудесный плагин jQuery.livequery аналог Behaviour – помогающий создавать скрипты работающие “на манер css”.

   
  $('span.bugaga').livequery('click',function(){
     alert('Бугага');
  });
  $('span.gygygy').livequery(function(){
     $(this).bind('click',function(){
        alert('Надо же - кликнули. Гыгыгы');
     });
     alert('В документе появились span-ы c классом gygygy');
  });
  

  Поясняю – работает это так же как и jQuery.bind, за одним лишь исключением – элементов на странице к моменту вызова функции может и не быть. Когда они появяться – livequery “навесит” на них нужные обработчики. Очень удобно. Но будьте внимательны и осторожны – не стоит увлекаться – чем больше элементов будут переданы в livequery, тем “тормознее” будет система – каждые 20мс проводиться поиск элементов в целью найти и обезвредить навесить нужные эвенты (а также после разнообразных манипуляций с dom).

• И последний на этот раз факт – как известно jQuery “оборачивается” в функцию $() – уж больно кратко,красиво и удобно в использовании. Но в эту же функцию любят “оборачиваться” многие известные js-фреймворки. И это казалось бы ставит крест на совместном их использовании… Но не в случае с jQuery – его авторы понимают что они не одни на белом свете. jQuery.noConflict(); “отпустит” функцию $(), правда сам код использующий jQuery в этом случае должен содержать либо полное название функции [ jQuery("selector").action(); ] или же должен быть “завёрнут” в анонимную функцию [ (function($) { original_code})(jQuery); ]

И всё-таки он обновляется! (да-да – а земля круглая и вертится).

Самые, на мой взгляд, вкусные изменения это закладка “Stack” в отладчике. (Её как раз стало очень нехватать – ранее стек вызова показывался в строке с меню и тупо не помещался в ней) и возможность использовать внешний редактор(!) по умолчанию это aptana.

Появились и визуальные изменения – подсветка исполняемого блока кода например. А вот «“better” debugging icons» по-моему паршивые – старые были привычнее и симпатичнее…

Вы можете взглянуть на полный список изменений в этой версии и на свой страх и риск установить себе эту глючную версию, которая страдает падучей…

Technorati Tags: firefox, firebug

Всем хорош xdebug, но как непосредственно дебаггер использовать его было крайне неудобно. А IDE которые якобы поддерживают xdebug либо крайне неуклюжи (komodo), (либо|и) дОроги.
Но вот появился свет в окне – обнаружен плагин к notepad++, который превращает этот шустрый и удобный редактор в полноценную php ide. Превращает он пока не очень хорошо (плагин не вышел из alpha-версий) – не работают половина hotkey-ев (вероятно из-за конфликтов с другими плагинами) да и интерфейсные глюки имеются,но уже сейчас отладка проходит на ура.
Настройка окружения тривиальна: скачиваете xdebug (если вы по непонятным причинам не сделали этого раньше), и делаете несколько шаманских пассов над php.ini:

zend_extension_ts=/path/to/php_xdebug.dll
xdebug.remote_enable=1
xdebug.remote_handler=dbgp
xdebug.remote_mode=req
xdebug.idekey=default

и рестартите apache. Сам dbgpPlugin имеет в данный момент минимальные настройки – укажите ip сервера, DOCUMENT_ROOT на сервере и локальный, например:

127.0.0.1 | default | /home/site.name/public_html | d:\wwwroot\home\site.name\public_html

А вот стартовать debug-сессию из notepad++ у меня не получилось. Но это не беда, поскольку есть xdebug helper – extension для firefox, с помощью которого усилием мысли одним кликом эту самую сессию можно стартовать.

Счастливой отладки… ;o)

Technorati Tags: xdebug, notepad++, firefox

Расскажу несколько фактов о jQuery, которые как мне видится, не очень понимают “отечественные программеры”

• при “навешивании” обработчика какого-либо event-а к (например $(‘#element’).click(handler); ) он НЕ заменяет предыдущий обработчик (если таковой имелся), т.е. код:

  $('#element').click(function(){  alert('hello');})
  $('#element').click(function(){  alert('world'); })
  

  Выведет оба alert-а, а не только второй как думается некоторым.

• Непосредственно из первого вытекает следующий факт – конструкций $(document).ready(blablabla); в коде может быть “бесчисленное” количество раз – все обработчики вызовутся в порядке их добавления.
• Система событий в jQuery позволяет не ограничиваться теми событиями, которые есть в документации – можно создавать события самостоятельно:

  $('button').click(function(){ jQuery.event.trigger("buttonClicked");});
  $('div').bind('buttonClicked',function(){ $(this).hide();});
  $('span').bind('buttonClicked',function(){ $(this).show();});
  

  Подобная техника позволяет существенно упростить код и сделать его “читабельнее”.

• Анимационные эффекты в jQuery асинхронны и нередко возникает вопрос – как одну функцию выполнить строго после завершения первой. Все core-функции jQuery связанные с эффектами в качестве последнего параметра принимают callback – функцию, которая вызовется по завершению текущего эффекта:

  $('element-1').fadeOut(3000,function(){
        $('element-2').fadeIn(1500,function() {
        alert('done second effect');
     });
  });
  

• К ЛЮБОМУ html-элементу можно добавить ЛЮБОЙ атрибут (). По этим “самодельным” атрибутам элементы можно найти с помощью селекторов jQuery:

  var elements_by_attr = $('[@myownattr]');
  var elements_by_attr_with_value = $('[@myownattr="somevalue"]');
  var spans_by_attr = $('span[@myownattr]');
  

  Очень полезное “явление” при создании своих собственных элементов управления (и не только).

Ну и напоследок подкину найденную статейку “jQuery for JavaScript programmers”, прочитать которую стоит тем, кто только начинает осваивать прелести jQuery . Материал изложен на английском.

На просторах интернета не нашлось достойного js-контрола – аналога CheckListBox. Восполнил этот недостаток плагинчиком для jQuery. Как и всё в мире jQuery – применяется ненавязчиво и просто – заменяет собой <select> $(“select”).checklistbox();

Взять можно здесь.