English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

BootStrap이 마우스 오버하면 드롭다운 목록 기능을 구현하는 방법

BootStrap를 사용하여 마우스 오버下拉 목록 기능을 구현합니다. 구체적인 내용은 다음과 같습니다:

 //가장 간단한 마우스 오버下拉 기능, Bootstrap 프레임워크 지식을 활용하여, Bootstrap를 직접 사용하지 않으면 네이버에서 사용법을 검색해보세요

 <html><head>
    <meta charset="UTF-8">
      <!-- Bootstrap를 도입 -->
   <link href="../css/bootstrap.min.css" rel="external nofollow" rel="stylesheet">
     <!-- jQuery 파일. bootstrap.min.js 이전에 반드시 가져오십시오 -->
    <script src="../libs/jquery-1.11.1.js"></script>
    <script src="../js/bootstrap.min.js"></script>
    <title></title>
  </head>
  <body>
<div class="dropdown" >
      <span class="dropdown-toggle" data-toggle="dropdown" data-target="#" >트리거</span>
       <ul class="dropdown-menu" >
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
      </ul>
    </div>
    <script>
      $(document).ready(function(){
        $("span").hover(function(){//마우스 오버 트리거 이벤트
        $(".dropdown-toggle").dropdown('toggle');
        });
      });
    </script>
  </body>
</html>

위에서 설명한 것은 편집자가 여러분에게 소개한 BootStrap의 마우스 오버 드롭 목록 기능입니다. 여러분에게 도움이 되길 바랍니다. 어떤 질문이든 댓글을 남겨 주시면, 편집자가 즉시 답변을 드리겠습니다. 또한,呐喊 강의 사이트에 대한 여러분의 지지에 깊이 감사드립니다!

선언: 이 문서의 내용은 인터넷에서 가져왔으며, 원저자에게 소유권이 있습니다. 이 내용은 인터넷 사용자가 자발적으로 기여하고 업로드한 것이며, 이 사이트는 소유권을 가지지 않으며, 인공적인 편집 처리를 하지 않았으며, 이에 대한 법적 책임도 부담하지 않습니다. 저작권 위반 내용이 발견되면 이메일을 보내 주시기 바랍니다: notice#oldtoolbag.com에 대한 신고를 위해 이메일을 보내시면(#을 @으로 변경하십시오.) 관련 증거를 제공하시면, 사실이 확인되면 이 사이트는 즉시 위반 내용을 삭제할 것입니다.

당신이 좋아할 만한 것