부트 스트랩 3 탭 - 호버시 표시?

커서를 가져 가면 탭을 활성화하고 싶습니다. 그 일을 가능하게하는 가장 좋은 방법은 무엇입니까? tabs.js 파일을 변경하지 않고 이상적입니다.부트 스트랩 3 탭 - 호버시 표시?

여기 탭은 페이지 중간에있는 세 개의 이미지 옵션이 있습니다 내 URL을 http://opennetsummit.wpengine.com/

입니다.

<div class="panel"> 
    <div class="panel-heading"> 
     <!-- Tabs --> 
     <div class="container"> 
      <ul class="nav panel-tabs"> 
       <li class="active col-sm-3"> 
        <a href="#tab1" data-toggle="tab"> 
         <div> 
          <img src="http://opennetsummit.wpengine.com/wp-content/uploads/2015/01/ons-rocket-icon.png"> 
          <h3>Workshops</h3> 
         </div> 
        </a> 
       </li> 
       <li class="col-sm-3"> 
        <a href="#tab2" data-toggle="tab"> 
         <div> 
          <img src="http://opennetsummit.wpengine.com/wp-content/uploads/2015/01/ons-circles-icon.png"> 
          <h3>Open Networking Summit</h3> 
         </div> 
        </a> 
       </li> 
       <li class="col-sm-3"> 
        <a href="#tab3" data-toggle="tab"> 
         <div> 
          <img src="http://opennetsummit.wpengine.com/wp-content/uploads/2015/01/ons-inspire-icon.png"> 
          <h3>Webinars</h3> 
         </div> 
        </a> 
       </li> 
       <li class="col-sm-3"> 
        <div class="mid-form"> 
         <h3>Get Updates</h3> 
         <form method="post" action="http://opennetsummit.wpengine.com/" id="mc4wp-form-1" class="form mc4wp-form form-inline" _lpchecked="1"> 
          <div class="row mid-form"> 

           <div class="col-sm-12"> 
            <input type="text" name="FNAME" placeholder="First Name" required="required" class="form-control" style="cursor: auto; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABHklEQVQ4EaVTO26DQBD1ohQWaS2lg9JybZ+AK7hNwx2oIoVf4UPQ0Lj1FdKktevIpel8AKNUkDcWMxpgSaIEaTVv3sx7uztiTdu2s/98DywOw3Dued4Who/M2aIx5lZV1aEsy0+qiwHELyi+Ytl0PQ69SxAxkWIA4RMRTdNsKE59juMcuZd6xIAFeZ6fGCdJ8kY4y7KAuTRNGd7jyEBXsdOPE3a0QGPsniOnnYMO67LgSQN9T41F2QGrQRRFCwyzoIF2qyBuKKbcOgPXdVeY9rMWgNsjf9ccYesJhk3f5dYT1HX9gR0LLQR30TnjkUEcx2uIuS4RnI+aj6sJR0AM8AaumPaM/rRehyWhXqbFAA9kh3/8/NvHxAYGAsZ/il8IalkCLBfNVAAAAABJRU5ErkJggg==); background-attachment: scroll; background-position: 100% 50%; background-repeat: no-repeat;"> 
           </div> 

           <div class="col-sm-12"> 
            <input type="text" name="LNAME" placeholder="Last Name" required="required" class="form-control"> 
           </div> 

           <div class="col-sm-12"> 
            <input type="email" name="EMAIL" placeholder="Email Address" required="required" class="form-control"> 
           </div> 

           <div class="col-sm-6 col-sm-offset-6"> 
            <input type="submit" value="Sign Up" class="form-control"> 
           </div> 

          </div> 

          <textarea name="_mc4wp_required_but_not_really" style="display: none !important;" class="form-control"></textarea> 
          <input type="hidden" name="_mc4wp_form_submit" value="1" class="form-control"> 
          <input type="hidden" name="_mc4wp_form_instance" value="1" class="form-control"> 
          <input type="hidden" name="_mc4wp_form_nonce" value="d8732ddff8" class="form-control"> 
         </form> 
        </div> 

       </li> 
      </ul> 
     </div> 
    </div> 
    <div class="panel-body hompage-panel"> 
     <div class="tab-content"> 
      <div class="tab-pane col-sm-8 col-sm-offset-2 active" id="tab1"> 
       <div class="col-sm-4 center"> 
        <img src="http://opennetsummit.wpengine.com/wp-content/uploads/2015/01/ons-circles-middle.png"> 
       </div> 

       <div class="col-sm-8"> 
        <h2>Defy Protocol </h2> 
        <h1>EMBRACE {OPEN} SOFTWARE</h1> 
        <h3>Open Networking Summit</h3> 
        <hr> 
        <p>June 15 - 18, 2015</p> 
        <p>Santa Clara Convention Center</p> 
        <a href="#" class="btn btn-more">More Information</a>  
       </div> 
      </div> 
      <div class="tab-pane col-sm-8 col-sm-offset-2" id="tab2">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div> 
      <div class="tab-pane col-sm-8 col-sm-offset-2" id="tab3">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div> 
     </div> 
    </div> 
</div>

출처

2015-01-24 Matt Sornson

$ (...)입니다 가져가 (함수() {// 열려있는 탭} 옵션을? – Steve