且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

向下滚动页面时移动的背景图像

更新时间:2021-12-30 00:17:23

像TylerH所说,它称为视差.您可以在此处看到示例.

Like TylerH said, it's called Parallax. You can see an example here.

使用JavaScript:

Using JavaScript:

var velocity = 0.5;

function update(){ 
var pos = $(window).scrollTop(); 
$('.container').each(function() { 
    var $element = $(this);
    // subtract some from the height b/c of the padding
    var height = $element.height()-18;
    $(this).css('backgroundPosition', '50% ' + Math.round((height - pos) * velocity) +  'px'); 
   }); 
   };

 $(window).bind('scroll', update);