背景图像平移背景大小：封面？

用鼠标移动时与下面的代码背景图像平移背景大小：封面？

$('body').mousemove(function(e){ 
    var mousePosX = 50 + (e.pageX/$(window).width())*25; 
    var mousePosY = 50 + (e.pageY/$(window).height())*25; 
    $('body').css('backgroundPosition', mousePosX + '% ' + mousePosY + '%'); 
});

这与（在宽度例如2000像素）的较大的背景图像完美地工作我目前平移我的网站的背景图像。有没有办法做到这一点，但与

background-size: cover;

？乍一看，它不会也不应该工作，因为背景图像总是与浏览器大小相同，因此无法平移。由于浏览器窗口从来不是最大高度（书签工具栏等的原因），它虽然可以垂直移动。是否可以有一个“封面背景”，但调整一些像素的背景图像的大小，所以它比视口稍大，但也会自动调整大小？

来源

2013-04-18 Grimwood

body{ 
    background:url(IMAGE); 
    background-size: 110%; 
    background-position: -10px -10px; 
    background-repeat:no-repeat; 
    background-attachment:fixed; 
}

来源

2013-04-18 21:03:04

这很容易......不知何故，我没有意识到“封面”与“100％”是一样的;）谢谢！ – Grimwood

刚刚意识到它毕竟不是一样的：/背景大小与％伸展背景图像（vs与“封面”保持正确的长宽比... – Grimwood

检查更新。它只是现在拉伸宽度，但保持他右纵横比。 –

背景图像平移背景大小：封面？

回答

相关问题