修復jQuery按鈕滑塊

Question

我的jQuery按鈕滑塊工作正常，我知道它here。

但我需要的只是一個滑塊，最後有兩個選項，一個「是」和一個「否」。當滑塊向左移動時，答案是肯定的，滑塊將回到中間位置，反之亦然。有人知道如何去做嗎？

這裏是我的代碼：

<?php 
foreach($data as $dta){ 
    $uuid = $dta->uuid; 
    $categ_uuid = $dta->category_uuid; 
    $subcateg_uuid = $dta->subcategory_uuid; 
    $question = $dta->content; 
} 
?> 
<div class="row-fluid"> 
<div class="span12 spacer"></div> 
<!-- QUESTION or IMAGE CONTAINER --> 
<div class="span12" style="margin:0;"> 
    <div class="span1"></div> 
    <div class="span10"> 
     <div class="span12"> 
      <div class="span2"></div> 
      <div class="span8" id="container"> 
       <!--<img class="media-object" data-src="holder.js/100%x230/sky/text:">--> 
       <?php echo $question; ?> 
      </div> 
      <div class="span2"></div> 
     </div> 
    </div> 
    <div class="span1" style="margin:0;"></div> 
</div> 
<!-- YES NO TOGGLE --> 
<div class="span12" style="margin:0;"> 
    <div class="span1"></div> 
    <div class="span10"> 
     <div class="span12"> 
      <div class="span1"></div> 
      <div class="span10"> 
      <form action="<?php echo $this->config->item('8L_URL').'/system/dovote'; ?>" id="yesno-form" method="post"> 
      <input type="hidden" name="question_uuid" value="<?php echo $uuid; ?>"> 
      <input type="hidden" name="category_uuid" value="<?php echo $categ_uuid; ?>"> 
      <input type="hidden" name="subcategory_uuid" value="<?php echo $subcateg_uuid; ?>"> 
      <input type="hidden" name="answer" id="answer"> 
      <div style="padding:30px 0px 50px 0px;"> 
         <div id="yes" name="answer">Yes</div> 
        <div style="float:right;"> 
         <div id="no" name="answer">No</div> 
        </div> 
        </div>  
     </form> 
      </div> 
      <div class="span1"></div> 
     </div> 
    </div> 
    <div class="span1" style="margin:0;"></div> 
</div> 
</div> 
<div id="dummy_div"></div> 
<div id="module-modal" class="modal hide fade" tabindex="-1"></div> 
<div id="app_loader_bar">&nbsp;</div> 
<script type='text/javascript'> 
$('#no').sliderbutton({ 
    text: 'NO', 
    activate: submitForm 
}); 

$('#yes').sliderbutton({ 
    direction: 'left', 
    text: 'YES', 
    activate: submitForm 
}); 

function submitForm(){ 
    $("#answer").val($(this).attr("id")); 
    $('#yesno-form').submit(); 
}; 
</script> 

Answer 1

我已經得到了解決。感謝引導滑塊。另外，我只是在CSS中做了一些事情，使它看起來像兩邊都是「是」和「否」。