javascript - 为什么 jQuery 可以在服务器上计算宽度,但在本地运行时却不能?

标签 javascript jquery html css width

我正在构建一个在服务器上运行良好的 jQuery 插件。但是,如果我尝试在本地使用它,它会失败,因为宽度和高度返回零。违规代码是:

$("#off-screen").load(function() {
    var naturalWidth = this.width;   
    var naturalHeight = this.height;
});

...应该获取 ID 为 off-screen 的动态加载的离视口(viewport)图像的宽度和高度。我正在使用 this.width 而不是 width();因为我在某处阅读它可能有助于缓存图像,但两种方式都不适用于本地。

在服务器上:http://kthornbloom.com/smoothzoom/

本地(从 Github 下载,您将看到图像无法在 Chrome 中正确缩放):https://github.com/kthornbloom/Smoothzoom

为什么完全相同的代码可以在服务器上运行,但不能在本地运行?

最佳答案

与其将 load 处理程序设置为不执行任何操作的匿名函数,不如将依赖于正在加载的图像的代码放入处理程序中。

这适用于我的机器:

$("#off-screen").load(function() {                       

    $('#lightwrap img').css({
        width: width,
        height: height,
        top: (offset.top - amountScrolled),
        left: offset.left
    });

    imageSizer();

    $('#lightbg').fadeIn();

    event.preventDefault(); 

});

关于javascript - 为什么 jQuery 可以在服务器上计算宽度,但在本地运行时却不能?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21194587/

相关文章:

php - 通过 PHP 条件操作 HTML 或 CSS

javascript - 在 Ruby on Rails 中使用 JavaScript 创建和删除 form_tag

javascript - 如何向该脚本添加不透明度过渡?

php - mpdf 发票未按我想要的方式生成

javascript - 按范围的 jQuery 验证字段

html - 我想将我的 UL 居中,但它不起作用

javascript - 在 React 中使用 array.map 动态创建组件时不会呈现组件

javascript - 仅当可视部分在 y 中溢出时,粘性元素才需要工作。 (如果高度很小则没有滚动条)

javascript - 将上一个日期选择器中选择的日期设置为最小日期

javascript - 使用 charAt JavaScript 为字符着色