Android 中调整窗口大小时,灯箱从视图中消失

发布于 12-07 12:05 字数 1647 浏览 1 评论 0原文

灯箱显示在右侧位置(顶部/左侧居中),但是当用户缩放时; lightobx 保持在相同位置(不考虑窗口/视图已调整大小/裁剪),

您可以在此处测试 单击标题的蓝色按钮,

我正在检查灯箱的代码,并且,我可以看到

$(window).bind('resize', $.proxy(function() {
          if (this.visible)
          {
            this.overlay.resize();
            if (!this.maximized) {
              this.movebox();
            }
          }
        }, this));

MOVEBOX() 在哪里:

function(w, h) {
        var size   = { x: $(window).width(),      y: $(window).height() };
        var scroll = { x: $(window).scrollLeft(), y: $(window).scrollTop() };
        var height = h!=null ? h : this.esqueleto.lightbox.outerHeight();
        var width  = w!=null ? w : this.esqueleto.lightbox.outerWidth();
        var y      = 0;
        var x      = 0;

         //vertically center
        x = scroll.x + ((size.x - width) / 2);

        if (this.visible) {
          y = scroll.y + (size.y - height) / 2;
        } else if (this.options.emergefrom == "bottom") {
          y = (scroll.y + size.y + 14);
        } else {// top
          y = (scroll.y - height) - 14;
        }

        if (this.visible) {

          if (!this.animations.move) {
            this.morph(this.esqueleto.move, {
              'left' : x
            }, 'move');
          }

          this.morph(this.esqueleto.move, {
            'top'  : y
          }, 'move');

        } else {

          this.esqueleto.move.css({
            'left' : x,
            'top'  : y
          });
        }
      }

问题是:如何正确计算新高度和新高度,以便灯箱遵循android 中的 srcoll/zoom (在 iphone 中它也会移动一点)

the lightbox is shown in the right position (top/left centered), but when users zoom; the lightobx stays in the same position (without considering the window/view has been resized/cropped),

You can test this here clicking in the blue button of the header

I am checking at the code of lightbox, and, i can see

$(window).bind('resize', $.proxy(function() {
          if (this.visible)
          {
            this.overlay.resize();
            if (!this.maximized) {
              this.movebox();
            }
          }
        }, this));

WHERE MOVEBOX() IS:

function(w, h) {
        var size   = { x: $(window).width(),      y: $(window).height() };
        var scroll = { x: $(window).scrollLeft(), y: $(window).scrollTop() };
        var height = h!=null ? h : this.esqueleto.lightbox.outerHeight();
        var width  = w!=null ? w : this.esqueleto.lightbox.outerWidth();
        var y      = 0;
        var x      = 0;

         //vertically center
        x = scroll.x + ((size.x - width) / 2);

        if (this.visible) {
          y = scroll.y + (size.y - height) / 2;
        } else if (this.options.emergefrom == "bottom") {
          y = (scroll.y + size.y + 14);
        } else {// top
          y = (scroll.y - height) - 14;
        }

        if (this.visible) {

          if (!this.animations.move) {
            this.morph(this.esqueleto.move, {
              'left' : x
            }, 'move');
          }

          this.morph(this.esqueleto.move, {
            'top'  : y
          }, 'move');

        } else {

          this.esqueleto.move.css({
            'left' : x,
            'top'  : y
          });
        }
      }

question is: how can I properly calculate new height and new with so the lightbox follows srcoll/zoom in android (and also in iphone it moves a bit)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

烂人2024-12-14 12:05:13

我在 move() element on window.resize( ) 函数在 Android 上不起作用 可能会为您提供一些关于该主题的信息。我猜您在使用scrollLeft() 时遇到了某种问题。

悲伤的时刻:(

My answer at move() element on window.resize() function not working on Android might shed some light on the subject for you. I'm guessing you're running into some sort of problem with scrollLeft().

Sad times :(

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文