動畫無法在Firefox和IE瀏覽器中工作

Question

我想使用jquery顯示我的div容器與我的按鈕協調..當頁面第一次加載時，所有的div容器都會隱藏起來。當使用點擊一個按鈕時，將出現不同的容器。我的問題是，只有在Chrome中點擊按鈕時，div纔會顯示，但不是Firefox或IE。我很感激任何人都可以幫助我解決這個問題。謝謝。

HTML

<div> 
<ul id="menu"> 
    <li id="project"><a href="#"></a></li> 
    <li id="code"><a href="#"></a></li> 
    <li id="skill"><a href="#"></a></li> 
    <li id="about"><a href="#"></a></li> 
    <li id="contact"><a href="#"></a></li> 
</ul> 
</div> 

<div id='projects'> 
    contents 
</div> 
<div id='skillContainer'> 
    contents 
</div> 
<div id='codeContainer'> 
    contents 
</div> 
....... 

我的Jquery ...

function breakline(position) { 
    $('#breakline').animate({ 
    top:position},'slow'); 
    console.log(position); 
    }; 

function hideAll() { 
    $('#projects').hide(); 
    $('#codeContainer').hide(); 
    $('#skillContainer').hide(); 
    $('#aboutContainer').hide(); 
    $('#contactContainer').hide(); 
    $('#bonusSkill').hide(); 
    $('#mePic').hide(); 
    $('#phoneNumber').hide(); 

}; 

hideAll(); 

$('#project a').click(function(){ 
    hideAll(); 
    breakline(256); 

    $('#projects').animate( //won't show in firefox or IE 
    {opacity:'toggle', height:'toggle'},'slow'); 


}); 



$('#code a').click(function(){ 
    hideAll(); 
    breakline(200); 

    $('#codeContainer').animate(//won't show in firefox or IE 
    {opacity:'toggle', height:'toggle'},'slow'); 

}); 




$('#skill a').click(function(){ 

    hideAll(); 
    breakline(236); 

    $('#bonusSkill').animate( //won't show in firefox or IE 
    {opacity:'toggle', height:'toggle'},'slow'); 

    $('#skillContainer').animate(
    {opacity:'toggle', height:'toggle'},'slow'); 


}); 

Answer 1

從我可以看到你正在使用的是IE和Firefox unsuported的console.log（無螢火蟲）。刪除該行應該可以解決您的問題。