如何在引導程序div上顯示按鈕？

Question

我的查詢就像渲染按鈕並隱藏在boostrap中的form-group的每個div中。

<form class="form-horizontal" role="form"> 

    <div class="form-group"> 
     <div class="button-wrapper"> 
      <label class="col-sm-3 control-label no-padding-right">Label 01:</label> 
      <div class="col-sm-3"> 
       <input type="text" id="txt_codigo" class="form-control" maxlength="40" /> 
      </div> 
     </div> 

     <div class="button-wrapper"> 
      <label class="col-sm-3 control-label no-padding-right">Label 02:</label> 
      <div class="col-sm-3"> 
       <input type="text" id="txt_codigo" class="form-control" maxlength="40" /> 
      </div> 
     </div> 
    </div> 

</form> 

我告訴你一個截圖我想要實現：

Image of how it should be

我想是顯示在右上方的按鈕，將光標定位指針和時隱藏當指針被移出光標。 按鈕必須有一個簡單的事件。

<div class="button-wrapper"> 

感謝

Answer 1

這是一些jQuery，它顯示當用戶將鼠標懸停在標籤父div上時的圖標/ imgs。

https://jsfiddle.net/yb4cdnzj/

HTML

<div class="lblClass"> 
    <label class="withBtns">Label 1</label> 
    <div class="buttons"> 
    <img class="btn1" src="#"> 
    <img class="btn2" src="#"> 
    <img class="btn3" src="#"> 
    </div> 
    <input type="text"> 

    <label>Label 2</label> 
    <input type="text"> 
</div> 

CSS

.lblClass { 
    width: 50%; 
    display: block; 
} 
label { 
    display: block; 
    padding: 5px; 
} 
.withBtns { 
    float: left; 
} 
.buttons { 
    display: none; 
} 
.buttons img { 
    float: right; 
    display: hidden; 
} 
input { 
    width: 100%; 
    padding: 5px; 
} 

jQuery的

$(".lblClass").hover(function() { 
    $(".buttons").toggle("slow"); 
}); 

Answer 2

怎麼樣一些CSS？

.form-horizontal .button-wrapper { 
    display: none; 
} 
.form-horizontal:hover .button-wrapper { 
    display: inline-block; 
}