Question

我有这段代码：

$(function() {

 var myWidth = $(".container").width();
 var myHeight = $(window).height();
 console.log(myHeight);
 var myShift = (1920 - myWidth)/2;

 $(".container").scrollLeft(myShift);


 //small window
 $(".dragMe").css({"left":myShift/10+"px", "width":(myWidth)/10+"px", "height":myHeight/10+"px"});
 $(".dragMe").draggable({
            addClasses: false, 
            containment: "parent",
            drag: function(event, ui) { 
              var offset = $(this).offset();
              var xPos = offset.left;
              var yPos = offset.top;
              console.log(yPos);
              $(".container").scrollLeft(xPos*10);
              $(".container").scrollTop(yPos*10+"px");
            }
 });
});

我想要实现的是在图像内部滚动.container由半透明div与类dragMe的移动触发。任何人都知道为什么它只能左右工作，而不是顶部，底部？

Answer 1

您的容器无法滚动，因为它无法滚动。

当您查看示例时，垂直滚动条属于窗口，但不属于您的容器。你可以试试这个：

$(window).scrollTop(yPos * 10);

（但* 10不是我认为的好价值）

Answer 2

如果允许div增加100％的高度，您将无法使用$('.container').scrollTop。你需要设置.container的宽度和高度，它就像魅力一样。

JsFiddle：http://jsfiddle.net/MEr3a/9/

ScrollTop - jQuery不滚动

2 个答案: