如何自动调整图像的屏幕大小从Alt属性，而不是src

how to automatically resize image to screen size from alt attribute and not src

本文关键字：属性 Alt src 调整 何自动 图像 屏幕      更新时间：2023-09-26

我已经下载了一个图像滚动面板，它改变了背景图像。我想让图像自动调整屏幕大小。为此，我使用了以下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=''/>

thank you in advance

try this 

 <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=''/>
相关文章：