0

我们正忙着写一个投资组合类型的插件。

我们需要知道如何让脚本知道每次页面在窗口调整大小后加载时屏幕的大小。在用户移动鼠标的那一刻，会一遍又一遍地计算窗口大小。我们只在页面第一次加载和调整大小后才需要这个。

最好的解决方案是什么？谢谢！

$(document).on("mousemove", function (event) {
    var mouseposX = event.pageX;
    var mouseposY = event.pageY;
    windowX = $(window).width();
    windowY = $(window).height();
    offsetX = Math.round(-(mouseposX / windowX * (blokjeContainerWidth - windowX)));
    offsetY = Math.round(-(mouseposY / windowY * (blokjeContainerHeight - windowY)));
});

这是示例的链接：portoflio

4

3 回答 3

1

尝试在对象上使用该resize功能。window然后你可以调用加载函数使用.resize()

$(window).resize(function() { 
    var mouseposX = event.pageX;
    var mouseposY = event.pageY;
    windowX = $(window).width();
    windowY = $(window).height();
    offsetX = Math.round(-(mouseposX / windowX * (blokjeContainerWidth - windowX)));
    offsetY = Math.round(-(mouseposY / windowY * (blokjeContainerHeight - windowY)));
}).resize();
于 2013-11-07T14:25:35.127 回答
1

无需将其绑定到事件，只需在（在 DOM 准备好之后）或（在加载资源之后）mousemove调用计算。$(document).ready()$(window).load()

然后将上面的代码绑定到窗口resize事件而不是mousemove. 您可能还想研究 jQuery 插件的节流/去抖动，因为resize不同浏览器的事件触发不一致。

于 2013-11-07T14:26:23.363 回答
0

您可以使用 jquery 轻松获取信息

var ww = $(window).width();//initial width
var wh = $(window).height();//initial height 
$(window).on('resize', function() {
    ww = $(this).width();//new width
    wh = $(this).height();//new height
});

因此，您只需将 x 和 y 值更改为：

windowX = ww;
windowY = wh;

我将报告添加到小提琴中，因此您可以在值更新时看到它们。

http://jsfiddle.net/filever10/CWhzM/

于 2013-11-07T14:33:13.300 回答