是否可以在保持「右上」的同時更改背景位置？

我有一個背景與背景位置「右上角」的對象是否可以在保持「右上」的同時更改背景位置？

我想將此背景位置上移10px（懸停），但只要我更改值，新值是插入從0,0點（左上角），但我想（右上角）

是否有任何100％的CSS解決方案呢？

來源

2011-09-11 ajax333221

如果你只是想這個靜態爲什麼不把剃掉頂部的版本10px的形象？ – daniel

我只想在懸停時將它移動10px，我會更新我的問題以使其更清晰 – ajax333221

爲什麼不簡單地使用'background-postion：10px right;'或'background-postion：-10px right;'（取決於什麼你正在嘗試做）？ –

我想這是你想要什麼：

div{ 
    height:450px; 
    width:450px; 
    border:1px solid red; 
    background-image:url(//IMAGE); 
    background-repeat:no-repeat; 
    background-position: 100% 0; 
} 

div:hover{ 
    background-position: 100% -10px; 
}

爲它一個background-position:100% 0套到右上角。然後從懸停高度減去10px。

例子：http://jsfiddle.net/jasongennaro/Teyfj/

高度，寬度和邊框僅用於舉例

來源

2011-09-11 05:59:25

這樣做 – ajax333221

很高興幫助@ ogps92！ –

如果你想改變懸停特定元素的背景圖像：

#my_element { 
    background-image: url(/path/to/image); 
] 
#my_element:hover { 
    background-image: url(/path/to/another/image); 
]

所以，你可以做的第二圖像與10px的頂掉，這應該工作，我想用body代替#my_element 。

來源

2011-09-11 05:55:29 daniel

我已經知道了，但我只想使用1個背景，然後移動位置，因爲下載第二個背景時會有延遲，我討厭它。（我知道有預先緩存它們的變通辦法，但我真的只是更喜歡使用1背景） – ajax333221

是否可以在保持「右上」的同時更改背景位置？

回答

相關問題