Lightbox image download

Question

Я использую Lightbox 2 в нескольких галереях изображений. Я бы хотел, чтобы мои пользователи загружали изображения в галерею, пока они просматривают их в Лайтбоксе. Кнопка «Загрузить» была бы идеальной, и я ее подниму под подписью.

Проблема заключается в том, что я сосать в Javascript (этот проект является внутренним инструментом, используемым нечасто, и я вызвался взломать его вместе. Это не моя область знаний). Я нашел некоторые довольно хорошие начала, чтобы получить функцию, которую я хочу, но я не знаю, как сшить их вместе. Вот на что я смотрю, и я был бы признателен за более полные инструкции (т. Е. Вставьте эти строки кода ... после этой строки ... в lightbox.js).

То, что я нашел, но не могу использовать:

1.) рабочий WordPress плагина - но я не использую WordPress

Here вы можете найти мод версию Lightbox предлагаемый как плагин WordPress. This site использует его (посмотрите на фотографии детей в костюмах для захвата движения). Я думаю, что ссылка «Скачать», которую он вставил, идеально подходит, но я бы предпочел не менять свою разметку для работы с плагином WordPress. Я хочу следовать шаблону Lightbox 2 с помощью data-lightbox.

2.) Этот фрагмент, который я не понимаю. Он был снабжен криптографической инструкцией «изменить файл lightbox.js». Но где ?:

$('<div/>', { "class": 'lb-saveContainer' }).append($('<a/>', { "href": '', "target":"_blank" }).append($('<img/>', { src: this.options.fileSaveImage })))

Answer 1

Добавить свою разметку fo r кнопку загрузки в шаблон, который использует лайтбокс. Лайтбокс захватывает все клики плагину, поэтому вам нужно добавить обработчик событий к новой разметке. Делайте это в одной и той же начальной функции, что вы добавили разметку. Вы можете использовать

window.open() 

, чтобы открыть ссылку в новой вкладке.

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

this.album[this.currentImageIndex].link 

позже в функции updateDetails.

Answer 2

сниппет не изменяет файл, но JQuery добавить часть HTML кода в HTML в классе токов сНа, которые имеют класс фунт-saveContainer набор если есть

div class="lb-saveContainer" 
     a href ..... img1 /a 
     a href .... img2 /a 
     . 
     a href ... imgn /a 
    /div 

где серия тегов «a» используется для использования в качестве лайтбоксов , класс добавляет в div, для каждого «а», когда фрагмент запускает ссылку, чтобы открыть сохраненный просмотр изображений

Answer 3

Я знаю, что это старый пост, но я потратил много времени на поиск ответа на этот вопрос.

Если вы добавите следующий код в нижнюю часть лайтбокса.css. Вы сможете щелкнуть правой кнопкой мыши на изображение и выберите пункт «сохранить изображение как ...»

.lb-nav { 
     pointer-events: none; 
    } 

    .lb-prev, .lb-next { 
     pointer-events: auto; 
    }