부트 스트랩 모드 onmouseover

그래서 내 개인 웹 페이지에서 일하고 있는데, 이것은 부트 스트랩으로 처음 개발 한 것입니다. PHP, html, css 및 JS를 내 dev 스택으로 사용하고 있습니다. 내가 가지고있는 오류는 다음 요소를 만들려고합니다 : 1. PHP 테스트가 통과되면 div를 만들고 JS에서 onemouseover 이벤트를 첨부하십시오. (이 조각을 수행하는 방법을 알고 있습니다) 2. 원하는 부트 스트랩 모달을 열고 onmouseoever를 열고 닫기, onmouseleave. this.innerHTML = blahblahblah가 작동하지 않아 createModal 함수가 비어있는 코드입니다.부트 스트랩 모드 onmouseover

 <?php 
     if(!isset($_GET["nfc"])){ 
      $nfc = false; 
     } else { 
      $nfc = filter_var($_GET["nfc"], FILTER_VALIDATE_BOOLEAN); 
     } 
    ?> 

<?php 
     if ($nfc == true) { ?> 
      <a href="#" 
      id="nfc" 
      data-toggle="modal" 
      data-target="#basicModal"><i class="fa fa-chevron-circle-down fa-5x"></i></a> 
      <div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true"> 
       <div class="modal-dialog"> 
        <div class="modal-content"> 
         <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&amp;times;</button> 
         <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
         </div> 
         <div class="modal-body"> 
          <h3>Modal Body</h3> 
         </div> 
         <div class="modal-footer"> 
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
          <button type="button" class="btn btn-primary">Save changes</button> 
         </div> 
        </div> 
       </div> 
      </div> 
     <?php } else { ?> 
      <i class="fa fa-chevron-circle-down fa-5x"></i> 
     <?php } ?> 
    </div>

JS : VAR 소자 = document.getElementById를 ("NFC"); if (typeof (element)! = 'undefined'& & 요소! = null) { element.onmouseover = createModal; }

출처

2015-02-03 Austin Meyers

를 사용하여 모달 숨기기를 표시 할 수 있습니다. 모달 창은 표시 할 때 링크를 덮습니다. [popovers] (http://getbootstrap.com/javascript/#popovers)를 사용하고 js를 다음과 같이 작성하십시오 :'$ ("basicModal") popover ({trigger : 'hover'});' – doubleui

왜 모달이 완전히 모달 자체로 바뀌는 지 페이지의 초점처럼 모달을 onmouseleave로 만들 수 없습니다. 이 모달은 아주 특정한 시나리오에서만 나타납니다. 나는 경고를 아주 분명하게하고 싶습니다. 모달에는 종료 버튼과 대개 닫기 버튼이 모두 포함되어 있으며 바운더리 바깥을 클릭 할 때 모달이 사라 지므로 문제는 이제 어떻게됩니다? 모달 만 켜기는 어떻게합니까? –

'$ ('nfc') .hover (function() {$ ("# basicModal"). 모달 ('show');});'. 그리고'data-toggle' 속성을 제거합니다 (모달 클릭 동작을 표시하지 않으려면). [ "Usage"] (http://getbootstrap.com/javascript/#modals) 단락을 읽으십시오. – doubleui

당신은 당신은 a.onmouseleave에 근접 모달 수없는 다음과 같은 jQuery 코드

$(document).ready(function(e){ 
    $("body").find("#nfc").hover(function() { 
     $("#basicModal").modal('show'); 
    }, function(){ 
     $("#basicModal").modal('hide');        
    }); 
});

출처

2015-02-03 06:53:35

도움, 빠른 질문에 감사드립니다! 모달은 현재 내 window.onload 함수에 래핑 할 때 작동합니다. 이 함수 내에서이 코드는 var element = document.getElementById ("nfc"); \t \t if (typeof (element)! = 'undefined'&& 요소! = null) { \t \t \t $ (요소) .modal ('show'); \t \t}이 중복입니까? –

당신은 일반 자바 스크립트로 코드를 작성했고, 작성한 코드는 자바 스크립트로 작성된 플러그인 인 JQuery에 있으며, 오늘은 jquery를 사용하고 자바 스크립트에서도 수행 할 수있는 작업을 수행하지만 jquery는 우리의 작업을 만듭니다 자바 스크립트보다 더 쉽습니다. –

부트 스트랩 모드 onmouseover

답변

관련 문제