Javascript 根据调整大小的方向显示不同的图像

我有两张照片。我试图在浏览器向左调整大小时显示一个，在向右调整大小时显示另一个

    function adjustDirection() {
        var last_pos_x = window.screenX;

        if ( last_pos_x < window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoRight.png')";
        } else if (last_pos_x > window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoLeft.png')";
        }
    }
    window.onresize = adjustDirection;

功能调整方向（）{
var last_pos_x=window.screenX；
如果（最后位置xwindow.screenX）{
document.getElementById（“logo”）.style.backgroundImage=“url（'logoLeft.png'）”；
}
}
window.onresize=调整方向；

但是，似乎只有在函数外部声明了

last\u pos\u x

时，我的函数才开始工作，这显然是错误的，因为它只存储加载的

window.screenX

---

任何帮助都将不胜感激

最简单的解决方案是使用jQuery。将posX值存储在DOM中并检索它

HTML

Javascript

function adjustDirection() {
        var last_pos_x = $("#id").attr("data-posx");
        $("#id").attr("data-posx",window.screenX);
        if ( last_pos_x < window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoRight.png')";
        } else if (last_pos_x > window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoLeft.png')";
        }
    }
    window.onresize = adjustDirection;

功能调整方向（）{
var last_pos_x=$（“#id”）.attr（“数据posx”）；
$（“#id”）.attr（“数据posx”，window.screenX）；
如果（最后位置xwindow.screenX）{
document.getElementById（“logo”）.style.backgroundImage=“url（'logoLeft.png'）”；
}
}
window.onresize=调整方向；

仅使用js的新代码：

function adjustDirection() {
    var last_pos_x = window.screenX;
    return function() {
        if (last_pos_x < window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoRight.png')";
        } else if (last_pos_x > window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoLeft.png')";
        }
        last_pos_x = window.screenX;
    }
};
var z = adjustDirection();
window.onresize = z;

功能调整方向（）{
var last_pos_x=window.screenX；
返回函数（）{
如果（最后位置xwindow.screenX）{
document.getElementById（“logo”）.style.backgroundImage=“url（'logoLeft.png'）”；
}
last_pos_x=window.screenX；
}
};
var z=调整方向（）；
window.onresize=z；

OP请求vanilla@DeepakDavid是的，你能用js写吗？没有html？'code'文档。getElementById（'item1'）。setAttribute（“数据posx”，“0”）；函数adjustDirection（）{var last_pos_x=window.screenX；返回函数（）{if（last_pos_xwindow.screenX）{document.getElementById（“logo”）.style.backgroundImage=“url（'logoLeft.png'）”；}last_pos_x=window.screenX；}}；var z=adjustDirection（）；window.onresize=z可以在您的注释中进行编辑，以便我可以看到格式plz

function adjustDirection() {
    var last_pos_x = window.screenX;
    return function() {
        if (last_pos_x < window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoRight.png')";
        } else if (last_pos_x > window.screenX) {
            document.getElementById("logo").style.backgroundImage = "url('logoLeft.png')";
        }
        last_pos_x = window.screenX;
    }
};
var z = adjustDirection();
window.onresize = z;