Question

我下载了一张图片滚动窗格，可以更改背景图片。我想让图像在屏幕尺寸自动调整大小..为此我使用这个html线风格= “宽度：100％;高度：100％;” 但后来我意识到这条线对我的情况不起作用，因为滚动窗格的工作方式略有不同。

更具体地说，滚动窗格将使用img标记的alt属性作为背景图像，对于图像的缩略图，它将使用img标记的src属性。

<div class="wrapper thumbs_wrapper"> 
        <div class="thumbs"> 
            <img src="images/album/thumbs/1.jpg" alt="images/album/1.jpg"/> 
            <img src="images/album/thumbs/2.jpg" alt="images/album/2.jpg"/> 
        </div> 
</div>

所以，如果我在这里添加这一行

<img src="images/album/thumbs/1.jpg" alt="images/album/1.jpg" style="width:100%;height:100%;"/>

不会对背景图像进行任何更改，只会对缩略图进行任何更改..有没有办法从alt属性调整图像大小？

我只想从alt属性中获取img并使用javascript函数调整其大小，并将宽度和高度设置为100％。

我写过这个函数但它不起作用..

<script type="text/javascript">
function resize()
{
    var element = document.getElementById('imgg');
    var attr = element.getAttribute(alt);
    attr.width = '100%';
    attr.height = '100%';
}
</script>

<img id="imgg" onload="resize()" src="images/album/thumbs/1.jpg" alt="images/album/1.jpg" height='' width=''/>

提前谢谢

Answer 1

试试这个

 <script type="text/javascript">
$(document).ready(function () {
    var browserHeight = $(window).height();
    var browserWidth= $(window).width();
    $('.fullscreen').css({
        height: browserHeight ,
        width: browserWidth
    });
})
</script>
  <img id="imgg" class="fullscreen" src="images/album/thumbs/1.jpg" alt="images/album/1.jpg" height='' width=''/>

如何从alt属性而不是src自动将图像大小调整为屏幕大小

1 个答案: