2012-08-03 5 views
0

내가 작업중인 프로젝트에서 Twitter의 부트 스트랩 '축소'플러그인 (documentation)을 사용하고 있습니다. 접을 수있는 항목을 전환하려면 각 부모 요소를 클릭해야하는 방식을 정말 좋아하지 않으므로 마우스를 대면 대신 접을 수있는 항목을 표시하거나 숨기려면 직접 스크립트를 작성했습니다. 여기 Bootstrap Collapse의 API 클릭 이벤트를 사용 중지하는 방법

는 스크립트 코드입니다 :

$(function spark_item_hover() { 
    $(this).on('mouseenter.collapse.data-api', '[data-toggle=collapse]', function() { 
     var $this = $(this), target = $this.attr('data-target') 
     , option = $(target).data('collapse') ? 'show' : $this.data() 
     $(target).collapse(); 
     $(target).show('true'); 
    }) 
    $(this).on('mouseleave.collapse.data-api', '[data-toggle=collapse]', function() { 
     var $this = $(this), target = $this.attr('data-target') 
     , option = $(target).data('collapse') ? 'hide' : $this.data() 
     $(target).hide('true'); 
    }) 
}) 

그리고 여기에 내가 (제거 관련이없는 물건) HTML의 스크립트를 호출 방법 : 이것은 기본적으로 내가 뭘 원하는 것을

<li class="spark-item" onhover="spark_item_hover()" data-target="#context155" data-toggle="collapse"> 
    <div class="span11"> 
     <div class="row-fluid"> 
      <div id="context155" class="collapse" style="height: auto; display: none;"></div> 
     </div> 
    </div> 
</li> 

: 마우스를 가져 가면 접힌 항목이 표시되고 사라질 때 숨길 수 있습니다. 유일한 문제는 API에 정의 된 클릭 이벤트 (아래쪽 here)가 여전히 사용되고 있다는 것입니다. 상위 요소를 클릭하면 접을 수있는 항목이 토글됩니다. API에서 클릭 토글을 사용 중지하는 방법이 있는지 궁금합니다. 나는 여전히 요소 내부를 클릭 할 수 있기를 원한다. (다른 페이지에 대한 링크를 포함하고 있기 때문이다.) 나는 접을 수있는 항목을 토글하지 않기를 바랍니다.

답변

1

다른 토글 토큰 ([data-toggle=hovercollapse])을 사용할 수 있습니다. 그렇게하면 플러그인을 사용할 수 없게됩니다.

+0

근무했습니다. 고맙습니다!! – YNotSayNay

관련 문제