2016-03-22 21 views
2

私はslidetoggle()を使用しています。バナーとlocalStorageを切り替えて、切り替えられたバナーの最後の状態を記憶します。LocalTorageがslideToggleで動作しない(トグルで動作)

localStorageは、トグル()で正常に動作します。ただし、slideToggle()を使用します。もうそれはありません。また、トグル(toggle(500);)にアニメーションを追加すると、localStorageはもはや動作しません。

$('#button').click(function() { 
     $(this).siblings().slideToggle(); 
     localStorage.setItem('display', $(this).siblings().is(':hidden')); 
    }); 
    var block = localStorage.getItem('display'); 
    if (block == 'true') { 
     $('#banner').hide() 
    } 

何が問題になりますか?

JSFiddle:http://jsfiddle.net/9pj9ws5u/12/

答えて

3

これは、それが行われるべきかです:

$(this).siblings().slideToggle(function() { 
    // Code is triggered once the animations finished and the element is hidden 
    // $(this) - reference to the SIBLING element 
    localStorage.setItem('display', $(this).is(':hidden')); 
}); 

アニメーションが完了する前に、それが隠されていた場合は、確認されているため、コードが働いていませんでした。アニメーションコールバック関数の中にロジックを置くことで、アニメーションが終了したらそれが確実に呼び出されます。

+0

なぜ以前にはうまくいかなかったのかの説明を追加するとよいでしょう。 – JCOC611

+0

@ JCOC611あなたが正しいです。私の答えに追加 –

関連する問題