ハンバーガーボタンはXボタンに移動しますが、リフレッシュ時にハンバーガーボタンとして戻ることはありません

Question

なぜ、人がハンバーガーボタンをクリックしてXボタンに移動し、サイトをリフレッシュした後、ハンバーガーボタンを再び表示させるにはどうすればよいですか？

ここに私のウェブサイトへのリンクです：http://dannysaavedra.com/photobeta

ここでは私のハンバーガーボタンとCSSでXボタンのコードです。

これはFirefoxブラウザでのみ発生します。

/*Begin Hamburger Menu*/ 
#menu { 
    position: fixed; 
    top:17px; 
    right: 20px; 
    height: 28px; 
    width: 35px; 
    cursor: pointer; 
    z-index: 7; 
} 

.nav-trigger { 
    cursor: pointer; 
    clip: rect(0, 0, 0, 0); 
    position: fixed; 
} 

label { 
    position: absolute; 
    height: 100%; 
    width: 100%; 
    cursor: pointer; 
} 

#menuButton, 
#menuButton:before, 
#menuButton:after { 
    cursor: pointer; 
    position: fixed; 
    top: 30px; 
    right: 20px; 
    z-index: 2; 
    border-radius: 1px; 
    height: 5px; 
    width: 35px; 
    background-color: white; 
    content: ''; 
} 

.nav-trigger:checked + #menuButton:before, 
.nav-trigger:checked + #menuButton:after { 
    top: 30px; 
    right:20px; 
    background-color: red; 
} 

#menuButton:before { 
    top: 20px; 
} 

#menuButton:after { 
    top: 40px; 
} 

.nav-trigger:checked + #menuButton:after { 
    transform: rotate(-45deg); 
} 

.nav-trigger:checked + #menuButton { 
    background-color: transparent; 
} 

.nav-trigger:checked + #menuButton:before { 
    transform: rotate(45deg); 
} 

.nav-trigger + #menuButton:before, 
.nav-trigger + #menuButton:after { 
    transition: all 200ms ease-in-out; 
} 

.nav-trigger:checked + #menuButton:before, 
.nav-trigger:checked + #menuButton:after { 
    transition: all 200ms ease-in-out; 
} 

.nav-trigger + #menuButton, 
.site-wrap { 
    transition: left 0.2s; 
} 

.nav-trigger + #menuButton { 
    right: 20px; 
    transition: right 0.2s; 
    transition: all 10ms ease-in-out; 
} 

.nav-trigger:checked ~ .site-wrap { 
    left: -300px; 
    box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.5); 
    transition: left 0.2s; 
} 

Answer 1

編集： Firefoxでリセットされていないようです。私は同様のトピックを見つけました。これは、与えられた要素にautocomplete="off"を追加することを示唆しています。トピックhereを検索してください。

OLD： そうのように、すべての遷移に-webkit-トランジションを追加してみてください：

-webkit-transition: someTransition; 
transition: someTransition; 

同じ変換についても同様です。