如果仍在视图中,则用于更改DIV偏移的JQuery算法

JQuery Algorithm for changing DIV offset if still in view

本文关键字:DIV 算法 JQuery 用于 视图 如果      更新时间:2023-09-26

希望您能够提供帮助。

我的示例代码:

http://jsfiddle.net/RevengerTT/YZtyj/1/

我正在尝试计算一个算法,它将捕获offset().left,并计算它是否已将DIV"stretchflex"移出视图状态。

我真的很难理解这一点(今天看了一段快速视频后开始JQuery编码)。

我已经处理了三个变量,我认为应该给我所需的值,但我遇到的问题是var z = $("#stretchflex").width()并不代表DIV的"实际"宽度,而是它的可见宽度

有人看到我哪里错了吗?

        $("#SFPanLeft").click(function () {
            var x = $("#SFHolder").width()
            var y = $("#stretchflex").offset().left
            var z = $("#stretchflex").width()
            $("#x").html("X : " + x.toString());
            $("#y").html("Y : " + y.toString());
            $("#z").html("Z : " + z.toString());
            if (x > (z + y)) {            /* <----This is the bit which doesn't work */
                var left = $("#stretchflex").offset().left
                left -= 176
                $("#stretchflex").css({
                    left: left + 'px'
                });
            };
        });

非常感谢您的提前帮助-无法想象我已经通过搜索这个网站找到了多少次我需要的答案:)

我想我已经对此进行了排序。

万一有人发现这个。。。

        $("#SFPanLeft").click(function () {
            var x = $("#SFHolder").width();
            var y = $("#stretchflex").offset().left;
            var z = $("#stretchflex").get(0).scrollWidth; /* using scrollWidth fixes */
            $("#x").html("X : " + x.toString());
            $("#y").html("Y : " + y.toString());
            $("#z").html("Z : " + z.toString());
            if (x < (z + y)) {                            /* updated algorithm */
                var left = $("#stretchflex").offset().left
                left -= 176
                $("#stretchflex").css({
                    left: left + 'px'
                });
            };
        });