Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

RusFAQ.ru: Программирование на Java / JavaScript


Хостинг Портала RusFAQ.ru:
MosHoster.ru - Профессиональный хостинг на Windows 2008

РАССЫЛКИ ПОРТАЛА RUSFAQ.RU

Чемпионы рейтинга экспертов в этой рассылке

Botsman
Статус: Студент
Рейтинг: 142
∙ повысить рейтинг >>
Товарищ Бородин
Статус: Профессионал
Рейтинг: 110
∙ повысить рейтинг >>
Hubbitus
Статус: 6-й класс
Рейтинг: 94
∙ повысить рейтинг >>

/ КОМПЬЮТЕРЫ И ПО / Языки программирования / Java/JavaScript

Выпуск № 610
от 29.03.2009, 22:35

Администратор:Калашников О.А.
В рассылке:Подписчиков: 371, Экспертов: 24
В номере:Вопросов: 1, Ответов: 1

Нам важно Ваше мнение об этой рассылке.
Оценить этот выпуск рассылки >>

Вопрос № 163156: Здравствуйте..наверное все уже знают что такое lightbox (скрипт. который при клике на изображении выдает его полноразмерную версию с визуальными эффектами)<img src="http://rusfaq.ru/images/Forum/5.gif" border="0"> ..так вот, я хочу написать свой, но ...


Вопрос № 163.156
Здравствуйте..наверное все уже знают что такое lightbox (скрипт. который при клике на изображении выдает его полноразмерную версию с визуальными эффектами) ..так вот, я хочу написать свой, но только заточенный немного под себя..не знаю с чего и как начать
Прошу кто знает помочь в этом вопросе...Я так понимаю тут нужно выделить следующие моменты:
1)сделать ссылку на полноразмерную версию
2)анимацию при открытии (плавный показ полноразмерной версии)
3)затемнение всего что находится за картинкой
4)закрытие полноразмерного изображения при клике
Может что то еще есть...Заранее благодарен за ответы..Прошу не советовать использовать готовый lightbox..хочу сделать сам
Отправлен: 24.03.2009, 17:43
Вопрос задал: psevdo (статус: 1-й класс)
Всего ответов: 1
Мини-форум вопроса >>> (сообщений: 0)

Отвечает: BahuL
Здравствуйте, psevdo!
Ну для начала могу коротко описать метод работы лайтбокса...
Создается набор маленьких картинок(превьюшек), каждая заключена в свой тег а с определенным параметром rel = "lightbox" и href который указывает на большую картинку.
В подключаемой библиотеке lightbox.js в низу есть функция которая вешает включение лайтбокса после того как страница полностью загрузится, а точнее он вешает себя на window.onload.
В своей функции инициализации он на все теги <a> с rel = "lightbox" вешает свою онклик функцию
var anchors = document.getElementsByTagName("a");

// loop through all anchor tags
for (var i=0; i<anchors.length; i++){
var anchor = anchors[i];

if (anchor.getAttribute("href") && (anchor.getAttribute("rel") == "lightbox")){
anchor.onclick = function () {showLightbox(this); return false;}
}
}

стоит отметить что эта онклик функция кроме вызова затемнения и показа картинок, еще и запрещает браузеру перейти по ссылке вернув по онклик значение false.
Теперь про затемнение.
Для этого они создают с помощью яваскрипта див с абсолютным позиционированием и размерами равными размерам веб страницы.
при нажатии на маленькую картинки Див выводится поверх всех элементов страницы(прозрачность достигается с помощью
Для всех браузеров
#overlay{ background-image: url(overlay.png); }
Для эксплорера
* html #overlay{
background-color: #000;
background-color: transparent;
background-image: url(blank.gif);
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
}
).

В центре этого дива находится другой див в котором и рисуется большая картинка и элементы управления типа туда, сюда, закрыть.
Это основное... Думаю написанное мною выше поможет Вам определиться с чего начать писать.
Ответ отправил: BahuL (статус: 3-й класс)
Ответ отправлен: 24.03.2009, 18:19

Как сказать этому эксперту "спасибо"?
  • Отправить SMS #thank 245971 на номер 1151 (Россия) | Еще номера >>
  • Отправить WebMoney:
  • Вам помогли? Пожалуйста, поблагодарите эксперта за это!


    Вы имеете возможность оценить этот выпуск рассылки.
    Нам очень важно Ваше мнение!
    Оценить этот выпуск рассылки >>

    Отправить вопрос экспертам этой рассылки

    Приложение (если необходимо):

    * Код программы, выдержки из закона и т.п. дополнение к вопросу.
    Эта информация будет отображена в аналогичном окне как есть.

    Обратите внимание!
    Вопрос будет отправлен всем экспертам данной рассылки!

    Для того, чтобы отправить вопрос выбранным экспертам этой рассылки или
    экспертам другой рассылки портала RusFAQ.ru, зайдите непосредственно на RusFAQ.ru.


    Форма НЕ работает в почтовых программах The BAT! и MS Outlook (кроме версии 2003+)!
    Чтобы отправить вопрос, откройте это письмо в браузере или зайдите на сайт RusFAQ.ru.

    Скажите "спасибо" эксперту, который помог Вам!

    Отправьте СМС-сообщение с тестом #thank НОМЕР_ОТВЕТА
    на короткий номер 1151 (Россия)

    Номер ответа и конкретный текст СМС указан внизу каждого ответа.

    Полный список номеров >>

    * Стоимость одного СМС-сообщения от 7.15 руб. и зависит от оператора сотовой связи. (полный список тарифов)
    ** При ошибочном вводе номера ответа или текста #thank услуга считается оказанной, денежные средства не возвращаются.
    *** Сумма выплаты эксперту-автору ответа расчитывается из суммы перечислений на портал от биллинговой компании.


    © 2001-2009, Портал RusFAQ.ru, Россия, Москва.
    Авторское право: ООО "Мастер-Эксперт Про"
    Техподдержка портала, тел.: +7 (926) 535-23-31
    Хостинг: "Московский хостер"
    Поддержка: "Московский дизайнер"
    Авторские права | Реклама на портале

    ∙ Версия системы: 5.13 от 01.12.2008

    Яндекс Rambler's Top100
    RusFAQ.ru | MosHoster.ru | MosDesigner.ru
    RusIRC.ru | Kalashnikoff.ru | RadioLeader.ru

    В избранное