call007

Жаль, надо более менее кросбраузерно. По видимому придётся грузить две картинки и использовать map area(

Да вот пробовал применить к svg элементу box-shadow и как-то никак, хотя фон меняется и т.д.

C setTimeOut надо играться

Привет! Вопрос спецам. Существует ли способ создания блока не прямоугольной, произвольной области с последующим навешиванием на него box-shadow при :hover? Конкретно нужно для того, чтобы при наведении на картинку произвольной формы, например, треугольника, появлялось свечение выстраивающееся по траектории треугольника. (но не обязательно треугольника, фигура может быть разная). Map area и подгрузку двух картинок (одну без свечения, другую с..) не предлагать.

Как и обещал, вот зачем мне это нужно было.

Вроде то, что надо! Большое спасибо всем! Чуть позже покажу зачем мне это надо было =)

nerv, странно, но переменная result хранит в себе "0" в браузерах Opera, IE, Firefox. А работает, как я понял только в хроме(

Не очень понял как это работает

Чуть поменял код для наглядности - http://jsfiddle.net/VPYgk/22/ По идее, алерт выскакивать должен в тот момент, когда цветные блоки пересекаются в центре видимой области?

Всем добрый день. Вопрос таков... Допустим, у нас есть страница, к примеру http://forum.htmlbook.ru/ На ней есть скролл справа. Как отследить, что пользователь прокрутил ровно на половину всю страницу, или ровно на треть, четверть и т.д.? Интересует с использованием jQuery. Сам что-то никак не могу придумать. Но кажется мне, что это не так сложно =) Спасибо.

psywalker отличный веб-мастер, готовый выручить в трудную минуту! Помог разобраться в одном непростом моменте JavaScript'а. Еще раз спасибо, что уделил своё время

Поскольку при вёрстке всегда учитываю ие6, то желательно. Но если это геморно, то можно пренебречь.

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

Да, именно! Тоже верно. Вообще, надо, чтобы плавно разъезжались, не очень быстро. И так, чтобы на экране было полностью видно момент предела на который блоки разъедутся. Да, всё правильно. А когда скролл поднимаем и на экране уже становятся видны эти подопытные блоки, то таким же образом их надо перемещать в исходную позицию.

Всем привет. Чтобы было сразу понятно, предлагаю посмотреть пример того, что получилось: http://mafia-world.ru/verstka/test/index.html Как это работает: Если медленно прокручивать скролл, то можно увидеть как два блока (один из которых находится под текстом RODINA, другой под ним) как бы выезжают из под него. В определенный момент, а точнее когда нижний блок тёмного цвета полностью вылазит из текста RODINA (а это происходит, когда его css параметр "top" становится равным 285px) - эти блоки прекращают своё движение при скроллинге вниз. Решил сделать этот эффект посредством события scroll. Однако, вероятно, это событие вызывается не на каждый прокрученный пиксель скролла. И если прокрутить резко вниз страницу, представленную выше, то не известно где окажутся разъехавшиеся блоки. Как должно работать: 1) Сколлим страницу вниз, и два блока разъезжаются на то расстояние, на которое мы проскролили окно браузера. Плюс надо указать момент остановки движения блоков. 2) Скроллим страницу вверх, два блока должны принимать таким же образом исходную позицию. Можно ли вообще осуществить задуманный эффект? И каким лучше всего способом? Вот то, что пока сообразил: $(document).ready(function() { $(window).scrollTop(0); //при обновлении страницы поднимаем скролл страницы в самый верх }); $(window).scroll(function() { var topBlock3 = parseInt($('.block3').css('top')); // переменная, хранящая в себе значение "top" темного блока if (topBlock3 >= 285) { //если у этого блока значение "top" превышает 285, то удаляем событие scroll $(window).unbind(); } var scrollHeight = $(window).scrollTop(); // переменная, хранящая в себе значение расстояния, прокрученного // скроллом вниз и вверх (надо бы как-то сделать две переменные данного типа, чтобы в одной // прописывалось расстояние прокрутки вверх, а у другой переменной - вниз) $('.block3').animate({'top':'+='+scrollHeight},50); // прибавляем к значению "top" темного блока, при каждом вызове события scroll, значение сохранённое в переменной scrollHeight $('.block2').animate({'top':'-='+scrollHeight},50); // отнимаем у значения "top" серого блока, при каждом вызове события scroll, значение сохранённое в переменной scrollHeight });