JQuery mouseleave（）が機能しません

Question

div要素の上にマウスを置くと、マウスがdivを離れるときにテキストが拡大されますが、テキストは同じサイズのままです。私はmouseenter()、mouseleave()とhover()の機能を試しましたが、何も動作していないようです。ここに私のコードは次のとおりです。
はJQuery：

function main() { 
 
    page(); 
 
    $('.header h1').delay(2000).css('font-size', '50px'); 
 
    $('.header').mouseenter(function() { 
 
\t $('.header h1').css('font-size', '80px'); 
 
    }); 
 
    $('.header').mouseleave(function() { 
 
\t $('header h1').css('font-size', '50px'); 
 
    }); 
 
} 
 
$(document).ready(main);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="header"> 
 

 
\t <h1>Jacobsky</h1> 
 

 
\t <div class="navbar"> 
 

 
\t \t <a onclick="page('home')">Home</a> 
 

 
\t \t <a onclick="page('info')">Information</a> 
 

 
\t \t <a onclick="page('about')">About Us</a> 
 

 
\t \t <a onclick="page('contact')">Contact Us</a> 
 

 
\t \t <a onclick="page('m_info')">More Info</a> 
 

 
\t </div> 
 

 
</div>

onclick="page()"が何か他のものに関連しています。 誰でもこの問題を解決できますか？

Answer 1

$('header h1') 

修正されたコード：

function main() { 
    page(); 
    $('.header h1').delay(2000).css('font-size', '50px'); 
    $('.header').mouseenter(function() { 
    $('.header h1').css('font-size', '80px'); 
    }); 
    $('.header').mouseleave(function() { 
    $('.header h1').css('font-size', '50px'); 
    }); 
} 
$(document).ready(main); 

Answer 2

mouseleaveイベントで間違ったセレクタを使用しました（ ".header"ではなく "header"を使用しています）。これを試してみてください：（。）あなたは.headerクラス名にドットを見逃している

$('.header h1').css('font-size', '50px'); 

Answer 3

そのあなたのセレクタにタイプミスを持っているので、それは：

$('.header').mouseleave(function() { 
    $('.header h1').css('font-size', '50px'); 
});