2012-01-06 120 views
0

這一個有點混亂解釋。在我的頁面http://newmedia.leeds.ac.uk/ug10/cs10mm/abduction.html 我有一個節目「更多」和「更少」選項。點擊時,下拉菜單和背景圖片會出現。然而,下拉div的背景圖像的一小部分(頂部)不會隱藏。有誰知道這可能是爲什麼?如何隱藏已被jquery隱藏的div的背景圖片

這樣做的HTML低於,其次是CSS:

<div id="MORE"> 

    <button id="more">More</button> 
    <button id="less">Less</button> 

<div id="instructions"> 
    <p style="display: none"> The Mayor of Scaredy Cat Town has been abducted. Lawlessness has broken out across London and the city needs your help to find him. Follow the links on this site to scour the city in search of The Mayor. A reward, courtesy of The Mayor and his staff, is available for anyone able to find him. <br /> The Reward... <br /> An exclusive night of entertainment at the Mayors up-market bar, hosted by his head waiter,Henri. </p> 
</div> 

    <script> 
     $("button#more").click(function() { 
     $("p").show("slow"); 
     }); 

     $("button#less").click(function() { 
     $("p").hide("slow"); 
    });  
    </script> 
</div> 

CSS ...

#MORE { 
    position:relative; 
    z-index:100; 
} 

#more, #less { 
    background:none; 
    border:none; 
    color:#FFF; 
    font-family:Verdana, Geneva, sans-serif; 
    cursor: pointer; 
+0

從你的鏈接看起來你已經得到了這個工作,你應該接受如果是這樣, – mrtsherman 2012-01-06 20:03:26

回答

0

刪除風格= 「顯示:無」,從p,並將其與ID的說明添加到div,然後試試這個:

$( 「按鈕#多」)點擊(函數(){

$("div#instructions").show("slow"); 

    }); 

    $("button#less").click(function() { 

    $("div#instructions").hide("slow"); 

});  
+0

我已經試過這一個答案,以及改變.instructions爲#instructions。Niether的工作。林苦苦尋找是什麼阻止頂部被隱藏! – 2012-01-06 19:32:56

1

這是因爲你是隱藏的p標籤和背景它的容器上intructions.改爲隱藏。

$("#instructions").show("slow");