Co to jest alternatywa do zastosowania po usunięciu jQuery 1.9 .toggle (funkcja, funkcja)?

Question

Witam Próbuję stworzyć coś, co będzie się zmieniało kurczenie i rośnie na każdym kliknięciu, ale używam na mojej stronie jQuery 1.9. funkcja .toggle(function,function) została usunięta z jQuery 1.9, więc nie jestem do końca pewien, co powinienem użyć.

Każda pomoc będzie świetna.

Dzięki

jsfiddle (używa starego kodu, wersja jQuery 1.8): http://jsfiddle.net/TNAC6/

nowy jsfiddle (jQuery 1.9): http://jsfiddle.net/TNAC6/1/

Tu jest mój kod próbuję uczynić przełącznika. Zasadniczo rzeczą, którą przeżywam, jest div okręgu.

(function($){ 
    $.fn.createToggle = function(size) { 
     var ele = $(this); 
     var oldSize = ele.width(); 
     console.log("creating new toggle on element: " + ele + " old: " + oldSize + " new: " + size); 
     console.log("its content is" + ele.children(".content")); 
     var growfn = function() { 
      $(this).stop().animate({ 
       'width': size+'px', 
       'height': size+'px', 
       'margin-left': '-'+(size/2)+'px', 
       'margin-top': '-'+(size/2)+'px' 
      }, 500); 
      $(this).children(".content").toggle(); 
     }; 
     var shrinkfn = function() { 
      $(this).stop().animate({ 
       'width': oldSize+'px', 
       'height': oldSize+'px', 
       'margin-left': '-'+(oldSize/2)+'px', 
       'margin-top': '-'+(oldSize/2)+'px' 
      }, 500); 
      $(this).children(".content").toggle(); 
     }; 
     ele.click(function() { 
//insert code to toggle stuff 
     }); 
    }; 
})(jQuery); 

$(".home").createToggle(500); 

i css:

.circleBase { 
    -webkit-border-radius: 999px; 
    -moz-border-radius: 999px; 
    border-radius: 999px; 
    behavior: url(PIE.htc); 
} 

.home { 
    width: 200px; 
    height: 200px; 
    background: #FF5032; 
    position: absolute; 
    top: 300px; 
    left: 300px; 
    margin-left: -100px; 
    margin-top: -100px; 
} 

.title { 
    position: relative; 
    padding-top: 10%; 
    text-align: center; 
    font-weight: bold; 
    font-size: 24px; 
} 

.content { 
    text-align: center; 
    display: none; 
} 

i html:

<div class="circleBase home"> 
    <p class="title">Glen Takahashi<p> 
    <p class="content">THIS IS CONTENT<BR> THIS IS CONTENT<BR> THIS IS CONTENT<BR> THIS IS CONTENT<BR> THIS IS CONTENT</p> 
</div> 

Answer 1

Z dwoma stanami, można po prostu utrzymanie obecnego przełączać między opcjami państwa jako Boolean (użyłem clickState). Jeśli chcesz mieć wiele stanów, możesz nadal dodawać 1 do liczby stanów, a następnie sprawdzać moduł całkowitej liczby, aby określić, która funkcja powinna być uruchamiana w oparciu o stan.

I uaktualniony kod nieco od ele jest rzeczywiście obiekt jQuery chcesz pracować z:

http://jsfiddle.net/TNAC6/2/

Answer 2

$(document).ready(function() { 
    var flag=0; 
    $('selector').on('click', function(){ 
     var menu = $("element_to_toggle"); 
     if(flag==0){ 
      menu.text("click one"); 
      flag=1; 
      return; 
     } 
     else if(flag==1){ 
      menu.text("click two"); 
      flag=0; 
      return; 
     } 
    }); 
});