2012-08-28 61 views
0

塊內部有另一個相對塊,它具有父塊形式的背景(如圖片)。當我試圖改變我的塊的寬度時,相對塊消失。js動畫塊內部帶有圖像

picture

<!DOCTYPE html> 

<html> 
<head> 
<title></title> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 

<style> 
#button 
{ 
    width: 195px ; 
    height: 60px; 
    display: inline-block; 
    position: relative; 
    background: url('/res/bg.png') repeat-x; 
} 
#button div#arrow 
{ 
    background: url('/res/Arrow.png') no-repeat; 
    width: 30px; 
    height: 60px; 
    display: block; 
    position: absolute; 
    top:0px; 
    right: -30px; 
} 


</style> 
</head> 
<body> 

<div id='button'> 
<div id='arrow'></div> 
</div> 
</body> 
</html> 

忘記有關動畫的代碼: $( '#按鈕')動畫({寬度: ' - = 120像素'},2000)。

+1

它會在每個瀏覽器上消失嗎?你能否提供演示頁面? – fcalderan

+0

添加了一個js字符串,我用它來進行動畫製作,我只在js控制檯的chrome中試過它 –

+0

您可以將兩個div放在彼此的頂部,一個在底部有漸變背景,並且頂部的箭頭位於頂部,並將箭頭背景定位在右側(背景位置:右側;)。似乎不太容易出錯 – Asciiom

回答