Выводятся записи февраля-месяца 2012 года

CSS: какая разница между visibility:hidden и display:none?

Вопрос

И свойство visibility:hidden, и display:none скрывают отображение элемента на экране. Получается, что эти свойства работают идентично?

DIV с прозрачной картинкой не позволяет кликнуть по дочерним элементам, закрывая их

Вопрос

У меня на HTML-странице есть DIV с прозрачной фоновой картинкой, который позиционирован абсолютно, и он закрывает собою много всяких элементов, в том числе ссылок, кнопок и т.п.

Если я кликаю за пределами этого DIV, всё работает нормально. Но я никак не могу кликнуть по элементах, которые расположены за этим DIV. Получается, что он как бы замещает, или точнее сказать закрывает собою всё, что под ним (хотя он прозрачный и элементы видны).

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

Как сделать HTML-таблицу с фиксированными заголовками (закрепить их)?

Вопрос

Существует ли какой-нибудь кроссбраузерная CSS/JavaScript метод отобразить длинную HTML-таблицу, чтобы её заголовки оставались зафиксированными и не прокручивались вместе с телом таблицы?

Я бы хотел, чтобы посетитель мог выполнять прокрутку контекста в таблице, но при этом заголовки оставались всегда видны сверху, чтобы ему было легче ориентироваться.

Несколько фоновых изображений на CSS

Вопрос

Подскажите пожалуйста, возможно ли назначить одному элементу 2 фоновых изображения? Мне бы хотелось, чтобы одна картинка повторялась по горизонтали, а другая - через всю страницу и при этом была позади той, которая повторяется по-горизонтали.

Сейчас я делаю так: одну картинку назначаю фоновой для тега html, а другую для тега body.

html {
    background: url(images/bg.png);
}
body {
    background: url(images/bgtop.png) repeat-x;
}

Является ли такой подход правильным? Что, если я захочу 3 картинки? Возможно, есть метод получше?

Сериализация формы с помощью jQuery

Вопрос

Подскажите пожалуйста, как можно выполнить сериализацию всех элементов формы в объект JSON?

Мне хотелось бы найти такой универсальный метод, который бы автоматически создавал соответствующий моей форме объект JSON, чтобы мне не приходилось каждый раз писать код для конкретной формы. Мне также не нужна строка, которую можно получить методом $('#formid').serialize(), а также карта объекта, возвращаемая методом $('#formid').serializeArray().

Как на jQuery найти элементы по строке, которую они содержат?

Вопрос

Предположим, некая веб-страница содержит строку типа «Я просто строка». Как можно выполнить поиск элементов, которые содержат эту строку, используя jQuery? Например:

<div id="string-one">Я просто строка, самая обычная строка</div>
<div id="string-two">Я не просто строка. Я супер строка!</div>

В этом случае первый элемент должен быть найден, а второй - нет.

Получить реальною ширину и высоту картинки на jQuery в Safari и Chrome

Вопрос

Как можно получить реальную ширину и высоту картинки на jQuery в Safari и Chrome?

Следующее работает в Firefox 3, IE7 и Opera 9:

var pic = $("img");
// удалим атрибуты, если они заданы в HTML
pic.removeAttr("width"); 
pic.removeAttr("height");
var pic_real_width = pic.width();
var pic_real_height = pic.height();

Но веб-киты (Safari и Chrome) всегда возвращают 0. В чём дело? Никак не пойму.

Как определить клик за пределами элемента на jQuery?

Вопрос

У меня на веб-странице есть меню, которое полностью появляется после того, как пользователь кликнет на его заголовке. Я хотел бы скрыть пункты этого меню, когда пользователь кликает за его пределами.

Как добиться такого эффекта на jQuery? В идеале, должна быть какая-то функция типа:

$("#menuscontainer").clickOutsideThisElement(function() {
    // здесь меню прячется
});

Как запретить выделение текста на HTML-странице?

Вопрос

В моем проекте используются разные интерактивные элементы, которые являются кнопками, но сделаны на основе DIV-вов и т.п. Эти элементы выглядят не очень, когда текст в них выделен (это может случиться, если пользователь, к примеру, дважды кликнет по такой кнопке - поведение по умолчанию для большинства браузеров).

Я ищу какое-нибудь универсальное решение для запрета выделения текста, желательно конечно, чтобы использовались только CSS и HTML, однако если это не возможно, то пусть тогда будет JavaScript.

CSS: как убрать промежуток между двумя элементами inline-block?

Вопрос

Есть следующий HTML:

<div>
    <span class="in-line">Первый</span>
    <span class="in-line">Второй</span>
</div>

И этот CSS:

.in-line { 
    display:inline-block;
    width:100px;
}

Вот как это выглядит:

Пример
Первый
Второй

Я понимаю, почему это происходит, и что если я поставлю элементы в HTML в один ряд, то промежуток исчезнет:

<div>
    <span class="in-line">Первый</span><span class="in-line">Второй</span>
</div>

Но мне не очень удобно следить за HTML-разметкой и постоянно удалять эти отступы. Поэтому я надеюсь, что в CSS есть другое, более подходящее решение этой проблемы.

Назад, в будущее Вперёд, в прошлое