Question

我一直在努力将元素固定到页面的左侧，但也可以向上和向下滚动。

我已经尝试过将左侧位置更改为$（window）.scrollLeft（）的方法，但这会产生一个非常不稳定的动画。

我正在寻找的是这个小提琴的反面，但我无法让它起作用：

var leftInit = $(".scroll_fixed").offset().left;
var top = $('.scroll_fixed').offset().top - parseFloat($('.scroll_fixed').css('margin-       top').replace(/auto/, 0));

$(window).scroll(function(event) {
   var x = 0 - $(this).scrollLeft();
   var y = $(this).scrollTop();

// whether that's below the form
if (y >= top) {
    // if so, ad the fixed class
    $('.scroll_fixed').addClass('fixed');
} else {
    // otherwise remove it
    $('.scroll_fixed').removeClass('fixed');
}

$(".scroll_fixed").offset({
    left: x + leftInit
   });
});

请注意，此div固定在顶部但未保留。我正在寻找相反的东西，固定左边而不是顶部。有什么想法吗？

我尝试编辑这个小提琴，但无法使其正常工作。

Answer 1

这个问题：

var leftInit = $(".scroll_fixed").offset().left;
var top = $('.scroll_fixed').offset().top - parseFloat($('.scroll_fixed').css('margin-top').replace(/auto/, 0));

$(window).scroll(function(event) {
  var x = $(this).scrollLeft();
  var y = $(this).scrollTop();

  // whether that's below the form
  if (x >= leftInit) {
      // if so, ad the fixed class
      $('.scroll_fixed').addClass('fixed');
  } else {
      // otherwise remove it
      $('.scroll_fixed').removeClass('fixed');
  }

  $(".scroll_fixed").offset({
      left: x + leftInit
  });
});

编辑也改变

.scroll_fixed.fixed {
  position:absolute;

Answer 2

也许这就是你想要的http://jsfiddle.net/F7Bme/958/

.scroll_fixed {
    position: relative;
    float: left;
    left: 0;
}
.scroll_fixed div {
    float: left;
    position: relative
}

忘了JS

jQuery css修复了左边但绝对顶部

2 个答案: