JS-тень

[DarkPhoenix]

Мне понравилось; пожалуй, буду использовать. Спасибо!

[object]

пожалуйста)

[insecticide]

хм… неплохо, понравилось :)

[jAx]

Прикильно, но тень немного грубоватой получается. Но для решения «без пнг» — здорово. Я видел похожее решение у Mootools, для их проекта Mocha (http://mochaui.com/demo/). Там похожая настройка есть.

[alive]

Если мне не изменяет моя память, в Mocha через canvas реализовано, а здесь дивами.

[object]

отлично, спасибо за ссылку

[rossiysky]

Отлично, только вот к сожалению в эксплорере прозрачности нет :-(

[alive]

У меня в IE7 отлично работает.

[XaocCPS]

подтверждаю, в ie8 beta 2 не работает прозрачность, но в режиме совместимости с ie7 все работает

это происходит в связи с тем, что в новом ie8 «filter», который использует автор, устранен
я не так давно описывал это habrahabr.ru/blogs/ie/39446/

необходимо использовать нечто вроде этого:
-ms-filter: «progid: DXImageTransform.Microsoft.Alpha(Opacity=80, FinishOpacity=70, Style=2)»

автор! поправьте скрипт для работы в ie8!

[object]

спасибо, сейчас поправлю

[XaocCPS]

так и не работает
что-то не получилось?

[vietnamese]

Довольно-таки громоздко… Кучу ненужных блоков. В 6 ие 100% будут тормоза. ИМХО этот скрипт лишний. Разве что для собственного развития.

[object]

это и делалось для собственного развития, опубликовал чтобы доработать, плюс вдруг кто-то будет таки использовать, в любом случае спасибо)

[vietnamese]

и тебе «спасибо» за минус в карму.

[object]

я не минусил, так что спасибо не мне)

[vietnamese]

:)
тогда сорри. Пусть тому чуваку икнется раз 300…

[rossiysky]

Я в 8b2 смотрел.

[Zitrix]

я, как фанат отсутствия хлама в html, в шоке :)
редкий пример когда статические блоки тормозят браузер. второй фокс.

[Zitrix]

ну, и раз на то пошло, то уж надо как в фотошопе: направление (угол) и «высота» источника освещения. а, да, там еще можно кривую интенсивности выстраивать :)

[DarkPhoenix]

Нулевой Хром, полет нормальный :)

[Zitrix]

разумеется, но не Хромом единым :) когда ие6 тормозит — еще простительно, но надо что-то переделать, а когда тормозит фокс/опера — надо подумать а стоило вообще браться?

[object]

я сам фанат отсутствия цсс хлама в хтмл, но тут что-то расслабился)

[ring0]

Круто, в мемориз. Спасибо.

[Nikolay_Smeh]

Красиво, но, имхо, это изобретение велосипеда. Лучше использовать пнг.

[Banzeg]

Это хороший пример, но все же соглашусь с критикой: лучше отдать пару «лишних» Кб png.

[brain2xml]

можно использовать только в тех браузерах где css3 теней нету.

[proc]

Тут уже писали. А можно менять направление? То есть чтоб она вылизала не со всех 4-ех сторон одинаково.

[object]

попробую сделать

[object]

готово

[proc]

Да, не полохо,. Только смещение должно по x и y, а не только по x или по y

[Bonch]

Это не тень. Это glow.

[indalive]

оффтоп, почему JS, но ПНГ?]]

[object]

уважение к джс и неуважение к пнг может быть, вообще не задумывался)

[indalive]

что по-русски пишется — не уважительно, по Вашему?

[indalive]

«по-Вашему», умник! (сам себе)

[indalive]

кому-то не понравился мой ход рассуждений=[

[youmee]

автор, ты молодец. Не важно велосипед это или нет. Это саморазвитие. Эксперементируй ещё!

ps: если так обо всём говорить, тогда бы и изобретений и «новых фишек» не было бы. Веб 2.0 никогда бы не стал таким и энергосберегающих лампочек бы не было.

[object]

спасибо)

[name]

Господи, этот вопрос люди решили ещё в 2006 году: www.erik-rasmussen.com/blog/2006/12/04/the-shadower-realistic-drop-shadows-in-javascript/

[gentleman]

Что вы сразу «господи». Выше написано, что человек для саморазвития делал. Это во-первых. Во-вторых там целая библиотека под это подключается и выглядит корявенько, а здесь — 5 кб, которые еще и ужать можно. В-третьих человек старался, у него и получилось-то неплохо, чего тут вздыхать и разводить руками. Ну прям как 80-летняя бабка: «Помню, в 54-м мы и не такое делали...» )

[progger]

хм… Жалко, что в Firefox 3 не работает — тень черная.
Надо код глянуть

[tigerman]

У меня в FF3 все работает. Попробуйте уменьшить значение параметра «Плотность тени».

[progger]

версия 3.0, тень черная при любой плотности

[reaferon]

Использую для таких целей небольшой плагинчик для Jquery:
plugins.jquery.com/project/DropShadow
пример: eyebulb.com/dropshadow/

[gentleman]

Эх, доживу ли до тех времён, когда люди просто устанут писать в постах про js «а вот в jQuery ...»?

P.S. Хотя отмечу, что примеры как минимум забавные.

[reaferon]

А я и не утверждаю, что Jquery — ось добра. Если в проекте не используется, то и для требуемого функционала есть смысл использовать отдельный маленький скрипт. Другое дело, лично у меня всё больше проектов используют JQuery изначально.

[DeadLy]

Ещё, если можно, попробовать прикрутить такое смещение, как «вправо и вниз» и т. д.

[maxz]

Замечательно, особенно понравилось это: «else alert('что-то вы, ребята, накликали не то :)')»

[John_Cherep]

по-моему, очень круто =)

затестил в ИЕ 5,5 и 6,0. Ну, подтормаживает, ну и, что =) Зато работает везде и не PNG.

Если так судить, то скрипты, которые прикручиваются к сайту, чтобы он нормально отображался вплоть до ИЕ 5,5 с какой либо картинкой ПНГшной в теле документа — тоже весят дохера.

[Fade]

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

[gdX]

Интересно!
У тени можно ещё смещение в 2 стороны сделать — право/низ, к примеру.
И тип тени можно реализовать не уходящую в прозрачность, а с чёткими краями.

[sergonavt]

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

[object]

можно характеристики написать, а то на слух не сильно хорошо понял

[sergonavt]

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

[leshaogonkov]

по мне, так лучше скопировать интерфейс фотошопа, что бы удобнее было бы оттуда настройки копировать )

[object]

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