Lightbox JS v2.0

[kaoz]

сильная штука

[Skipper]

Класс!! Автору - огромное спасибо!

[shaliko]

На здоровье!

[Skipper]

Под "огромным спасибо" я имел в виду +1 к карме =)

[shaliko]

Спасибо!

[mak_sim]

Это тоже +1 к карме? :)))

[shaliko]

Нет, я даю только за топики :( Как только что то прочту от тебя, обещаю поднять карму.

[mak_sim]

Да это не я :).
Просто похоже надо вводить два раздельных термина. Спасибо и хабраспасибо. Второй поднимает карму 6)

[shaliko]

Ошибся :)

[Zitrix]

Классная штука: простая и без перегибов. Подключается действительно так, как написано, без сюрпризов.

[Stark]

100кБ скриптов ради такой простой штуки...
Для такого эффекта с лихвой хватит 5-10кБ кода.

[shaliko]

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

Скрипт можно подключать например только в фото галлереях. При большом кол-ве фоток 100 кб никакой роли не сыграют.

[mak_sim]

где они это 5-10кБ кода? Поэтому автору огромное спасибо!

[NaFigator]

Тяжеляк... :(

[k_s]

И как всегда осел седьмой все портит

Появляется сверху желтая полосочка с предупреждением и ничего не работает. Кто додумается нажать на нее и выбрать пункт "разблокировать" я не знаю.. тем более юзверь там пугается предупреждением о том, что это очень небезопасно.

Обидно =/

[shaliko]

Такое бвает и младших версиях IE, если JS скрипт запущен на страничке которая находится на локальном ПК. Это просто включается защита (Из-за дырок в IE).

Возможно у Вас такая же ситуация?!

[k_s]

то есть если страница на сервере, этого не будет?

[shaliko]

Да :)

Можешь проверить вот тут http://www.huddletogether.com/projects/l…

Не забудь отписать, дабы рассеять мои последнии сомнения.

[k_s]

я уже проверил на своем сайте, работает =)

сначала не заметил, что с локального запускаю, а когда с сервера пробовал, то подумал что IE запомнил просто, что я ему разрешил.. ступил короче =))


..плюсиков нет, извиняюсь =)

[shaliko]

Все ок :) Не за плюсы пишем :)

[BBSoD]

Уже за это я тебе поставлю плюсик :)

[butuzov]

лайтбокс использует около 120 кБ кода. (спасибо скриптоакулосу и прототипам). многовато? не кажется?
болье маленькое решение.

(на самом деле можно и того меньшим кодом обойтись)

[shaliko]

Скрипт принципиально ничем не отличается.

При подключении prototype.js, scriptaculous.js мы получем еще кучу всяких приятностей :) Я вообще уже больше года не делаю ни один сайт без prototype.js.

[butuzov]

не ви неподумайте я на прототип не гоню, но дял меня он действительно оказался слишком большим...
я больше джиквери отдаю предпочтение - да и некоторые тривиальные задачи вполне по дуже 20 кб кода =)

[Mourner]

Скрипт принципиально отличается тем, что построен на jQuery, а многим он гораздо больше по душе, чем Prototype. Попробуйте, - это просто волшебная библиотека. :) Уверен, понравится, если ознакомиться поближе.

[Mertas]

Вообще сейчас существует 3 больших JS библиотеки, которые дают примерно одинаковые возможности: семейства jQuery, prototype и mootools. У каждой есть преимущества и недостатки, и выбор как обычно за разработчиком.

[altmind]

нехорошо идти против всех - сильно отображается на карме, но я всеравно- выскажусь.

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

Если ко всему добавить необходимость в scriptaculous(и как следствие prototype), то вообще ситуация безрадостная...

ну и напоследок (вот пример того как заглючеило у меня)

Этот скрипт не добавляет accessibility, а наоборот - делает просмотр картинок неудобным (хотя и красивым), более того он нарушает почти десяток правил из недавнего списка why-does-my-site suck(простите, потерял ссылку).
Пожалуйста, не минусуйте

[shaliko]

Около года использую скрип и заглючил он только один раз под IE. Произошло это потому, что сайт ("CSS") был сверстан не по стандартам.

2 минуты ковыряния в CSS верстальщика и все было исправленно.

Возможно у Вас таже ситуация?!

[k_s]

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



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

[k_s]

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

[k_s]

и еще =)

чтобы выйти кнопка Close вообще не нужна, можно просто кликнуть по затемненной области

[shaliko]

Кстати с кармой у Вас все в порядке :) Судя по кол-ву проголосовавших и самой кармы.

[NaFigator]

Вот вам как раз за это плюс, в т.ч. и в карму.
Не прекращайте идти против, если ваше мнение отличается.

Согласен по всем статьям.

[Spunk]

хорошая штука. Видал на jamendo.com.

[smirnoffs]

Использую в галерее на http://vitrazh.kiev.ua уже полгода. Очень неплохой скрипт, пока что незаработал только в опере на планшете nokia 770, но это уже особенности встроенных браузеров.

[smirnoffs]

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

[shaliko]

Очень легко делается.

Правим строки в CSS:

#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

НА

#prevLink, #prevLink:visited { background: url(/all/prev.gif) left 53% no-repeat; }
#nextLink, #nextLink:visited { background: url(/all/next.gif) right 53% no-repeat; }

[shaliko]

Имена картинок только перепутал

[k_s]

имена правильные, только путь нужно к своей папке указать

[romeo]

хабрспасибо) хорошая штука.

[dubinka]

Просматривая картинки в галерее, нет возможности их сохранять. То есть скрипт - говно.

[shaliko]

Контекстное меню по-моему всегда и везде работает.

О какой возможности вы говорите?!

[dubinka]

Контекстное меню работает, но в нем нет возможности сохранить картинку, так как вызывается контекстное меню не картинки, из-зи того, что она сверху "накрыта" ссылками вперед-назад.

[k_s]

это только в FF

IE и Opera картинки сохраняют

[prudis]

Хорошо то хорошо, но вешает лишние 100К на страницу. Зачем такое удовольствие. Помоему такой скрипт если написать без паблик prototype.js scriptaculous.js универсальных библиотек, в которых ещё лежит и то что почти не юзается, то раз в 10 легче будет.

[shaliko]

А если использовать в галерее где и так много маленьких превьющек и даже 100 кб роли не сгырают. К тому же скрипты можно кешировать.

[prudis]

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

[k_s]

напишите пожалуйста =)

[prudis]

Ну если увижу потребность то могу написать :)

[DeleteOne]

Ааа - виста теперь и тут! Я этого не выдержу! Этот сайт хочет загрузится - [разрешить] [запретить] :)

[k_s]

так отключи эту UAC

[DeleteOne]

Я имею ввиду, что LightBox очень на нее похожа.

[k_s]

=)

все в виста на что-то похоже =)

[entze]

Скрипту 100 лет в обед, да и легковесных аналогов достаточно. Прелесть его в легкости использования, группировке с переходами и возможности подписывать.

http://jquery.com/demo/thickbox/
http://serennz.sakura.ne.jp/toybox/light…
http://www.jasons-toolbox.com/SlightlyTh…
http://orangoo.com/labs/GreyBox/

Не совсем box, зато полноценное слайд-шоу
http://www.madb.net/slideshow/

кармы мне, кармы!

[justnomi]

отлично
вот оказывается то, что я так давно искал!

[gazolin]

Расскажу вам об одном фокусе, который добавляет некоторой функциональности этому скрипту и проявляется неожиданным способом в теге "title".

Так вот. Если в !a href="images/image-1.jpg" rel="lightbox" title="my caption"!!img src=”images/image.jpg”!!/a! для "title" записать следующее - title="my caption!br!!a class=small_gray href='http://имя_сайта.com' target='_blank'!имя_сайта.com!/a!", чтоб в итоге получилось вот так !a href="i_work/work_saitcrauze1.gif" rel="lightbox" title="my caption!br!!a class=small_gray href='http://www.имя_сайта.com' target='_blank'>www.имя_сайта.com!/a!"!, то комментарий к картинке разширится возможностью перейти по ссылке, что в некоторых случаях очень сильно добавляет к юзабилити для сайта.

Для большей наглядности можно просмотреть пример на моем сайте: http://www.art4art.kiev.ua/?page=crauze

P.S. Знаком ! заменил знаки открывающие и закрывающие теги.

P.S.S. Кому пригодилось - оценит. Кому нет - карму не понижайте, потому как старался для человечества. :)

P.S.S.S. За пять лет моего использования html, вижу такое впервые, чтоб в title можно было писать другие теги. :)

[entze]

А это документировано там же, и title это же не тег, это параметр, который содержит текстовую строку, которая скриптом преобразуется в HTML код и помещается как подпись.

Title размещаемый в head никакого отношения к title= не имеет :)

[ego_generation]

меня оч порадовало.
пасиба!

[SerZh]

Если использовать теги в параметре title, получается конечно лучше, НО - при наведении на ссылку появляется совсем не симпотичное описание ссылки.
Подскажите как красиво замаскировать.
Спасибо.

[sigmatik]

Предидущая версия lightbox( без флеша ) работала исправно и стабильно.решил обновить на новую версию.Подключил 4 картинки, локально все работает,но при загрузке на сервер открывается только первая картинка, при попытке доступа к какой-либо из других наглухо включается gif загрузки и все.Может кто сталкивался?

[shah46]

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

[Chuchu]

Shah, привет! если вы нашли решение этой проблемы, тоесть как-то сделали так, напишите пожалуйста как! буду оч благодарна)

[angeloshka]

Здравствуйте, господа.
У меня вопрос по использованию лайбокса.
Подключается согласно описанию,
[code]<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
[/code]
но валидатор пишет следующее
document type does not allow element "a" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag.

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "" or "") inside an inline element (such as "", "", or "").

Как в XTML Strict это исправить?

[Nelius]

Lightbox хорош когда уже используется prototype. Спасибо автору за скрипт.
Для тех кто ищет простой и "легкий" скрипт с минимальным набором функций, попробуйте: http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm