SPLIT в JavaScript а также в JScript и IE6-8

Оказывается в методе String.split(), реализованном в JavaScript (по сравнению с реализацией этого метода в JScript и в IE6-8) есть отличие, заключающееся в том, что если в качестве разделителя задать регулярное выражение и обрамить разделитель в скобки, то он добавится в качестве элемента в выходной массив:

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

А для того, чтобы в JScript и Internet Explorer'ах разделители добавлялись в массив, можно переопределить метод String.prototype.split, который будет корректно работать везде (в соответствии со спецификацией ECMA-262 v3)

О том как это сделать можно прочитать тут -
http://blog.stevenlevithan.com/archives/cross-browser-split

Бешенный скролл jCarousel Lite.

Есть такая очень удобная js библиотека 
jCarousel Lite, которая позволяет очень просто делать анимации и карусели. И вот после очередного обновления сервера карусель начала бешено двигаться то вперёд, то назад.

А дело заключалось в том, что случайно в шапке сайта два раза подгружался скрипт инициализации и в том числе инициализации карусели. И таким образом заместо одной карусели появляется две - и обе листают практически одинаково и незаметно что их две. Но стоит переключиться на другую вкладку в браузере или свернуть - как карусель бешено крутится.
Отпишусь создателю библиотеки об этом issue.

Ширина макета с фиксированным контентом

Если макет веб-страницы фиксирован и должен корректно вписываться по ширине в окно браузера при разрешении 1024x768, то максимальная ширина для wrapper'а (или обёртки контента) должна быть 996px или меньше. При указании ширины больше этого числа (1000px например) в некоторых недобраузерах появляется горизонтальный скролл.

Пример макета - http://dl.dropbox.com/u/1218489/web/markup_996.html

Превью пользовательских изображений на сайте.

При загрузке картинок на сайт, нужно их правильно масштабировать и отображать на сайте. Картинки могут быть прямоугольные, квадратные, большие, маленькие, картинки может вообще не быть (стандартная картинка) или отсутствовать физически. И каждую ситуацию нужно учесть и рассмотреть.

Загрузочная флешка - Windows XP, Windows 7, Ubuntu.

Приобрёл я себе флешку Corsair Voyager на 16Gb, а свою старую A-Data 16Gb решил сделать загрузочной, реанимационной и восстановительной.

CSS Хаки для IE и других браузеров.

Сюда буду заносить всякие CSS хаки для различных браузеров:
http://www.quirksmode.org/css/contents.html
http://www.webdevout.net/css-hacks
http://dimox.name/personal_css_hacks_for_opera_firefox_ie/

http://habrahabr.ru/blogs/css/125396/
http://habrahabr.ru/blogs/css/62002/

http://centricle.com/ref/css/filters/

Getting Autocomplete For CodeIgniter 2.0 with PHPStorm

Getting Autocomplete For CodeIgniter 2.0 with PHPStorm | Grafik Kaos
Статья о том, чтобы заставить PHPStorm использовать автодополнение кода для средств фреймворка CodeIgniter 2.x

HTML формы и опера

Обнаружил в Опере интересную особенность, при которой jquery serialize() не получала данных из формы:

- Между тегами<form> и </form>
не должно быть неполных или пересекающихся таблиц
- Между тегами <form> и </form>
не должно быть другой формы (что очень логично).


Для следующего, не очень валидного кода:

<form id="firstform">
    <input type="text" name="firstname" value="MyName" />
    <input type="text" name="lastname" value="LastName" />

    <form id="secondform">
        <input type="text" name="age" value="21">
    </form>

    <input type="text" name="gender" value="male">
</form>

результатом операции $('#firstform').serialize() будет:

firstname=MyName&lastname=LastName&age=21

Закрывающая форма #secondform будет являться завершающим тегом для #firstform и поле gender будет опущено.

Впрочем это особенность не только Оперы, а самого jquery и его механизма выполнения операции serialize()

Firebug - тонкая настройка

Долгое время я не мог понять, почему Firebug раскрывает обычные css свойства, например

"border: 1px solid black"

превращается в 29 вот таких строчек:

element.style {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-bottom-color: black;
    border-bottom-style: solid;
    border-bottom-width: 1px;

Изменение размеров jqGrid'ов при изменении размеров окна браузера

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

Чтобы сделать так, чтобы ширина таблицы динамически изменялась при ресайзе браузера, необходимо добавить следующее событие:

$(window).bind('resize', function() {
    if (grid = $('.ui-jqgrid-btable:visible')) {
        grid.each(function(index) {
            gridId = $(this).attr('id');
            gridParentWidth = $('#gbox_' + gridId).parent().width();
            $('#' + gridId).setGridWidth(gridParentWidth - 20);
        });
    }
}).trigger('resize');

В результате чего при событии resize, вызванным изменением размеров окна браузера, ширина таблицы будет зависеть от новой ширины родительского контейнера (и минус 20 пикселей :) ).