PhotoSwipe открыть фото в новом окне

Я пытаюсь открыть текущую видимую фотографию в новом окне с помощью javascript, но она также должна работать на iPad. Я попытался добавить кнопку на панель инструментов (как в примере). Я также добавил css этой кнопки в photoswipe.css. Я добавил функцию javascript:

function getImgUrl()
{
    var divHead = getElementsByClassName(document, 'ps-carousel-content');
    var imgElement = divHead[0].getElementsByTagName("img");
    var imgUrl = imgElement[1].getAttribute('src');
    window.open(imgUrl.toString())
}

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

getToolbar: function(){
    return '<div class="ps-toolbar-close"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-play"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-previous" style="padding-top: 12px;"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-next"><div class="ps-toolbar-content"></div></div><div onclick="javascript: getImgUrl();" class="ps-toolbar-download"><div class="ps-toolbar-content"></div></div>';
}

Это отлично работает (фотография открывается в новом окне/вкладке) в браузерах webkit, таких как chrome и safari. Но когда я пробую это на iPad, это не работает. Просто ничего не происходит, когда я нажимаю кнопку.

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

Спасибо!


ios javascript html jquery photoswipe
person Wesley Lalieu    schedule 26.07.2012    source источник
comment
Вы пытались обернуть тег привязки и установить цель на _blank?   -  person Keith    schedule 27.07.2012

Ответы (1)


arrow_upward
0
arrow_downward

iPad, вероятно, блокирует этот скрипт как «всплывающее окно». См. этот вопрос SO. Чтобы убедиться, что проблема связана с блокировщиком всплывающих окон, перейдите в «Настройки» > «Safari» > «Блокировать всплывающие окна». Отключите его и посмотрите, работает ли он сейчас.

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

function getImgUrl()
{
    var divHead = getElementsByClassName(document, 'ps-carousel-content');
    var imgElement = divHead[0].getElementsByTagName("img");
    var imgUrl = imgElement[1].getAttribute('src');
    return imgUrl.toString();
}

getToolbar: function(){
    return '<div class="ps-toolbar-close"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-play"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-previous" style="padding-top: 12px;"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-next"><div class="ps-toolbar-content"></div></div><a href="' + getImgUrl() + '" target="_blank" class="ps-toolbar-download"><div class="ps-toolbar-content"></div></a>';
}

Я изменил вашу функцию, чтобы она возвращала URL-адрес изображения в виде строки, а затем вставила это право в вашу возвращаемую строку getToolbar.

person davehale23    schedule 28.09.2012