2012-07-28 112 views
0

我有一個簡單的代碼,讓我切換愨兩個div這對於兩個子導航包裝(#子NAV-包裝是替代NAV)的div切換狀態。他們被固定在瀏覽器底部:繼續使用頁面後cookie.js刷新

$(function(){ 
$('.button').click(function(){ 
    $('#sub-nav-wrapmin').toggle(); 
    $('#sub-nav-wrap').toggle(); 
    }); 
}); 

我希望做的是讓每個國家的div相同的用戶頁面刷新後,即使上了一個新的子的點擊作爲選擇標題菜單將保持不變,而不是訴諸默認狀態。

的HTML是這樣的:

<!--- Main Sub Wrap ---> 
<div id="bottom-wrap"> 
<!-- Mini Sub Nav --> 

<div id="sub-nav-wrapmin" class="snWrap divone"> 
     <div id="sn-contentmin"> 
      <div id="sn-likemin"></div> 
      <div id="sn-coffeesml"></div> 
      <div id="sn-sharemin"></div> 
      <div id="sn-commentsml"></div> 
      <div id="toggle-barmin"> 
        <div id="sn-sidebrdrmin"></div> 
        <div class="sn-toggle button"></div> 
      </div> 
       <ul class="sn-comicsmin menu"> 
       <li><a class="sn-comics" style="background-position: right top" href="#comic.html">Comic</a></li> 
       <li><a class="sn-archive" href="#archive.html">Archive</a></li> 
       <li><a class="sn-vote" href="#vote.html">Vote</a></li> 
       <li><a class="sn-spotlight" href="#spotlight.html">Spotlight</a></li> 
      </ul> 
     </div> 
</div> 
<!-- Sub Nav --> 
<div id="sub-nav-wrap" class="snWrap divtwo"> 
    <div id="sub-nav-container"> 
     <div id="sub-nav-content"> 

       <div id="sn-bnrlft"></div> 
       <div id="sn-bnrrgt"></div> 
       <div class="sn-dividelft"></div> 
       <div class="sn-dividergt"></div> 
       <div id="sn-likebg"></div> 
       <div id="sn-coffeebtn"> 
       </div> 
       <div id="sn-sharebtn"></div> 
       <div id="sn-commentbtn"></div>  
       <div id="toggle-bar"> 
        <div id="sn-sidebrdr"></div> 
        <div class="toggle button"></div> 
       </div>    
     </div> 
     <div id="sub-nav-brdr"> 
      <ul class="sub-nav-comics menu"> 
       <li><a class="comics" style="background-position: right top" href="#comic.html">Comic</a></li> 
       <li><a class="archive" href="#archive.html">Archive</a></li> 
       <li><a class="vote" href="#vote.html">Vote</a></li> 
       <li><a class="spotlight" href="#spotlight.html">Spotlight</a></li> 
      </ul> 
     </div> 
    </div> 
</div> 

的CSS是這樣的:

#sub-nav-wrap { 
    display: none; 
} 

這是我第一次問,我一直令人頭大我的大腦得到這個使用其他類似的工作代碼從這個網站,但沒有任何工作。 請幫助...

+0

我們可以看到你已經嘗試了什麼? – undefined 2012-07-28 11:32:57

+0

請小提琴上http://jsfiddle.net/ – Kir 2012-07-28 11:46:01

+0

你好Raminson和基爾我構建這裏的jsfiddle顯示導航是如何工作沒有一個cookie:http://jsfiddle.net/replacement4/nKFt7/60/ – 2012-07-28 14:14:24

回答

2

你幾乎做了一切正確的只有已經寫了很多的多餘:)

$(function(){ 
    if($.cookie('submin_visible') == 'true') { 
     $('#sub-nav-wrapmin').show(); 
     $('#sub-nav-wrap').hide(); 
    } else { 
     $('#sub-nav-wrapmin').hide(); 
     $('#sub-nav-wrap').show(); 
    } 

    $('.button').click(function(){ 
     $('#sub-nav-wrapmin').toggle(); 
     $('#sub-nav-wrap').toggle(); 

     var isVisible = $('#sub-nav-wrapmin').is(':visible').toString(); 
     $.cookie('submin_visible', isVisible); 
    }); 
}); 
+0

柯非常感謝你! – 2012-07-31 11:36:23

+0

請關閉否則被列爲懸而未決 – Kir 2012-07-31 13:01:06

+0

這個問題我如何正確關閉的問題? – 2012-08-01 11:50:08