Javascript onclick功能打开图像

时间:2013-08-30 07:14:12

标签: javascript

任何人都可以回答我的问题如何在没有空格的情况下将图像拉伸到宽度10%和高度100%? 我有Jscript打开这个图像代码

<p>
    <a href="javascript:;" onClick="window.open('Gallery/a1.JPG','no','scrollbars=yes,width=421,height=422%')" >
       View Larger
    </a>
</p>

并给我这个输出 http://i.stack.imgur.com/eMFPp.jpg

检查photoshop它没有空格,当我使用jscript查看图像并最大化窗口时,它给了我空白区域。为什么空白出现了?软糖!

这是代码

<p>
    <a href="javascript:;" onClick="window.open('Gallery/1.JPG','no','scrollbars=yes,width=429,height=290')" >
        <img src="Gallery/1.JPG" width="200" height="150" />
    </a>
</p>

这是如何使用javascript打开图像而不必在其角落有一个空白多余的区域。

我试过photoshop和photoshop显示没有多余的空白,而当我使用javascript打开图像链接它给我一个白色空间,你如何消除白色空间?或者你如何拉伸图像的宽度和高度?我尝试调整宽度和高度参数,但更宽的伸展它给我更多的空白......

帮助我卡住了

1 个答案:

答案 0 :(得分:0)

  

你所谓的图像实际上不是whitespace,它是   您在下面提到的窗口大小。

onClick="window.open('Gallery/1.JPG','no','scrollbars=yes,width=429,height=290')" >

看到差异,

<img src="Gallery/1.JPG" width="200" height="150" />
  

实际图片尺寸: width =“200”height =“150”

     

新弹出窗口大小:   width =“429”height =“290”

所以两者都有相同的值。如果是单张图片,您可以直接添加。

对于动态,您必须使用JavascriptjQuery。在这里,我将使用 jQuery 给您一个想法。

<强> HTML:

<p> <a href="javascript:;">
  <img src="http://pagead2.googlesyndication.com/simgad/10442396486498843578" />
  </a> 
</p>

<强> JQuery的:

$('a').on('click', function () {
    var img = $(this).find('img');
    var src = img.prop('src'); //GET IMG SOURCE
    var wid = img.width(); //GET IMG WIDTH
    var hie = img.height(); //GET IMG HEIGHT
    window.open(src, 'no', 'width=' + wid + ',height=' + hie);
});

尝试更改此Fiddle1Fiddle2

中的图片

希望我已经给出了清晰的图片。