Adapting jquery.flip to toggle with button click -


i'm learning jquery , i'm trying make flip plugin toggle flipped , unflipped settings pressing single button, can't work out how adapt manual trigger this.

http://nnattawat.github.io/flip/

here relevant code:

<script type="text/javascript">   $(function(){       $("#card-4").flip({       trigger: 'manual'     });      $("#flip-btn").click(function(){       $("#card-4").flip(true);       });      $("#unflip-btn").click(function(){       $("#card-4").flip(false);     });   }); </script> 

what best way this? trying re-write code ask if flip true, , if clicking button make flip false.

best,

simon

i downloaded plugin , set in environment. on bootstrap v3.3.4 , jquery v2.1.3. able work in environment doing this:

html

<div class="row">     <div class="col-md-6">          <div id="card-4">              <div class="front">                  front content             </div>              <div class="back">                 content             </div>          </div>      </div>     <div class="col-md-6">         <button class="btn btn-success" id="flip-btn">click flip</button>      </div>  </div><!-- /.row -->  

jquery

<script>     $("#card-4").flip({       trigger: "manual"     });      $(document).on("click", "#flip-btn", function() {         $("#card-4").flip(true);         $(this).attr("id","unflip-btn").text("click unflip").removeclass("btn-success").addclass("btn-danger");     });      $(document).on("click", "#unflip-btn", function() {         $("#card-4").flip(false);         $(this).attr("id","flip-btn").text("click flip").removeclass("btn-danger").addclass("btn-success");     }); </script> 

hope helps. otherwise, put js , html jsfiddle can better diagnose problem.


Comments

Popular posts from this blog

IF statement in MySQL trigger -

c++ - What does MSC in "// appease MSC" comments mean? -

javascript - Blogger related post gadget image Resize s72-c [ Need Expert Help ] -