Открыть изображение в новом окне - PullRequest
9 голосов
/ 18 января 2012

Как я могу открыть изображение в новом окне, используя id?

function swipe()
{   
    var largeImage = document.getElementById('largeImage');
    largeImage.style.display = 'block';
    largeImage.style.width=200+"px";
    largeImage.style.height=200+"px";                   
}

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

Ответы [ 7 ]

20 голосов
/ 18 января 2012
function swipe() {
   var largeImage = document.getElementById('largeImage');
   largeImage.style.display = 'block';
   largeImage.style.width=200+"px";
   largeImage.style.height=200+"px";
   var url=largeImage.getAttribute('src');
   window.open(url,'Image','width=largeImage.stylewidth,height=largeImage.style.height,resizable=1');
}

HTML код:

<img src="abc.jpg" onClick="swipe();"/>
7 голосов
/ 18 января 2012

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

window.open('http://example.com/someImage.png');

Я бы просто придерживался обычной ссылки на вашем месте.

3 голосов
/ 20 мая 2016

Попробуйте:

<img src="URL or BASE64" onclick="window.open(this.src)">
0 голосов
/ 17 июля 2018

HTML:

<input type="button" onclick="test()" value="test">

JavaScript

    function test(){
    url = "https://www.google.de//images/branding/googlelogo/2x/googlelogo_color_272x92dp.png";
    img = '<img src="'+url+'">';
    popup = window.open();
    popup.document.write(img);                        
    popup.print();
    }

Попробуйте это: https://jsfiddle.net/ne6f5axj/10/

Вы должны поместить ссылку на изображение в тег изображения.

0 голосов
/ 28 мая 2018

Попробуйте использовать следующую функцию:

function newTabImage() {
    var image = new Image();
    image.src = $('#idimage').attr('src');

    var w = window.open("",'_blank');
    w.document.write(image.outerHTML);
    w.document.close(); 
}

Вызовите с этим HTML-кодом:

<img id="idimage" src="data:image/jpg;base64,/9j/4A.." onclick="newTabImage()">
0 голосов
/ 18 января 2012

Что-то вроде

window.open(url,'htmlname','width=largeImage.stylewidth,height=largeImage.style.height,resizable=1');}

Но вы можете столкнуться с проблемами, если кто-то использует AdBlock или любой блокировщик всплывающих окон.

0 голосов
/ 18 января 2012
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...