javascript - 如何使 jquery 图像在屏幕尺寸上动态替换而不是仅在刷新时替换？

Question

我有一个 jquery 语句，可以根据屏幕尺寸替换图像

Fiddle

它仅适用于刷新。我希望它在用户调整屏幕大小超过我的参数集时自动运行。

我不知道该怎么做。

JQUERY

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
    $(document).ready(function () {
        var screenWidth = $(window).width();
        if ((screenWidth) < 769) {
            $("#logoHolder img").attr("src" , "images/payday_ira_logo_stacked_web.png")
        } else {
            $("#logoHolder img").attr("src", "images/payday_logo_long_web.png")
        }
    });

html

<div class="d3-d4 m1" id="logoHolder">
    <img src="images/payday_logo_long_web.png" alt="Pay Day IRA" />
</div>

Answer 1

试试这个:

window.onresize = function(event) {
    // your code goes here
};

Google“javascript 屏幕调整大小事件”