lightbox 아코디언 충돌

idTabs, lightbox (dreamweaver) 및 accordion (또한 dreamweaver)과 같은 3 개의 스크립트가있는 페이지가 있습니다. 라이트 박스는 아코디언으로 작동하지 않습니다. 그들 각각은 잘 작동하지만 아코디언 충돌이 결합되어 작동하지 않고 라이트 박스가 작동합니다. <head>lightbox 아코디언 충돌

이이

<link href="style.css" rel="stylesheet" type="text/css" media="screen"> 
<script type="text/javascript" src="jquery.idTabs.min.js"></script> 
<script src="jquery-ui-1.7.2/js/jquery-1.3.2.min.js" type="text/javascript"></script> 
<script src="jquery-ui-1.7.2/js/jquery-ui-1.7.2.min.js" type="text/javascript> 

</script> 
<script src="scripts/jquery.js" type="text/javascript"></script> 
<script src="scripts/lightbox.js" type="text/javascript"></script> 
<link href="jquery-ui-1.7.2/css/base/ui.core.css" rel="stylesheet" type="text/css" /> 
<link href="jquery-ui-1.7.2/css/base/ui.accordion.css" rel="stylesheet" type="text/css" /> 
<link href="jquery-ui-1.7.2/css/base/ui.theme.css" rel="stylesheet" type="text/css" /> 
<link href="jquery-ui-1.7.2/css/base/ui.images.css" rel="stylesheet" type="text/css" /> 

<script type="text/xml"> 
<!-- 
<oa:widgets> 
    <oa:widget wid="2028523" binding="#jQueryUIAccordion" /> 
    <oa:widget wid="2127022" binding="#gallery" /> 
</oa:widgets> 
--> 
</script> 
<link href="css/lightbox.css" rel="stylesheet" type="text/css" /> 
<link href="css/sample_lightbox_layout.css" rel="stylesheet" type="text/css" />

이되어이 아코디언

<script type="text/javascript"> 
    // BeginOAWidget_Instance_2028523: #jQueryUIAccordion 
    $(function(){ 
        // Accordion 
        $("#jQueryUIAccordion").accordion({ header: "h3", 
              >   animated: "slide", 
    event: "click", 
    collapsible : "false" 
    });   
      }); 

    // EndOAWidget_Instance_2028523 
      </script> 
      <!-- Accordion --> 
      <div id="jQueryUIAccordion" class="ui-gray-icons "> 
       <div> 
       <h3><a href="#">First</a></h3> 
       <div> Vivamus rutrum, sapien ac fermentum imperdiet, nisi libero mattis quam, eu mollis sem metus id ligula. </div> 
       </div> 
       <div> 
       <h3><a href="#">Second</a></h3> 
       <div>it, tristique egestas erat interdum id.</div> 
       </div> 
       <div> 
       <h3><a href="#">Third</a></h3> 
       <div>Nam dui erat, auctor a, dignissim quis.</div> 
       </div>

내가 당신을 잃었하지 않은 희망을하다

 <script type="text/javascript"> 
// BeginOAWidget_Instance_2127022: #gallery 
    $(function(){ 
     $('#gallery a').lightBox({ 
      imageLoading:   '/images/lightbox/lightbox-ico-loading.gif',  // (string) Path and the name of the loading icon 
      imageBtnPrev:   '/images/lightbox/lightbox-btn-prev.gif',   // (string) Path and the name of the prev button image 
      imageBtnNext:   '/images/lightbox/lightbox-btn-next.gif',   // (string) Path and the name of the next button image 
      imageBtnClose:   '/images/lightbox/lightbox-btn-close.gif',  // (string) Path and the name of the close btn 
      imageBlank:    '/images/lightbox/lightbox-blank.gif',   // (string) Path and the name of a blank image (one pixel) 
      fixedNavigation:  false,  // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface. 
      containerResizeSpeed: 400,    // Specify the resize duration of container image. These number are miliseconds. 400 is default. 
      overlayBgColor:   "#999999",  // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color. 
      overlayOpacity:   .6,  // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9 
      txtImage:    'Image',    //Default text of image 
      txtOf:     'of' 
     }); 
    }); 

// EndOAWidget_Instance_2127022 
     </script>

라이트 : 여기 몇 가지 코드 . 스크립트에 수정을 가하지 않았다는 것을 강조하고 싶습니다! 그들은 dreamweaver에서 추가 한 것과 같습니다. 고맙습니다 !

업데이트 : 문제가 해결되었습니다. 이 문제가있는 다른 사용자의 경우 라이트 박스에서 jquery를 삭제하면 아코디언의 jquery가 라이트 박스와 아코디언을 모두 처리합니다! 닫을 수 있습니다

최신 업데이트. 나는 오페라에서만 OK 아코디언과 라이트 박스를로드하는 것을 관찰했다. 파이어 폭스는 아코디언과 라이트 박스를 전혀로드하지 않습니다. 이것은 콘솔 오류입니다 : [12:56:53.907] $ ("# jQueryUIAccordion"). accordion은 @http://localhost/SITE/incercare3.php#:190 [12:56:53.969] $ ("# gallery a")의 함수가 아닙니다. http://localhost/SITE/incercare3.php#:275

크롬 @ 기능은 2 스크립트를로드 나던 :이 오류 크롬이 날 제공됩니다

catch되지 않은 형식 오류 : 개체 [개체 개체]있는 방법 '아코디언' catch되지 않은 형식 오류가 없습니다 : 개체 [개체 개체] 'lightBox'메서드가 없습니다.

의견?

출처

2011-11-28 Brande George

우선 jquery를 두 번로드합니다. 충돌이 발생할 것입니다.

둘째, 헤더에 lightbox 및 idTabs 스크립트가 포함 된 것을 볼 수 있습니다. 아코디언 플러그인은 어디에 있습니까?

idTabs는 jquery 전에로드되며, jquery 후에로드됩니다.

jQuery의 버전을 살펴보면 동시에 jQuery 1.7과 1.3이 필요한 플러그인을 사용하고 있는데 충돌이 발생합니다.

어쨌든 jQuery.noConflict()를 사용하여 두 버전을 동시에 사용할 수 있습니다.

연구에 당신을 위해 그냥 끝은 자바 스크립트 좀 더 : https://developer.mozilla.org/en/JavaScript/Guide

출처

2011-11-29 11:27:02

JQuery와 UI 1.7 아코디언입니다! –

좋아,하지만 jQuery UI가 사용하는 jQuery 1.3 그리고 당신은 라이트 박스에 대한 새로운 jquery를로드하는, 그것은 $ 전역 var에 오버로드되며, 당신은 아코디언 기능을 잃게됩니다. jquery noConflict 문서에서 다른 동일한 문제가 있습니다 .... noConflict 함께 두 번째 자바 스크립트 인스턴스를로드하고 $$ 같은 다른 var 사용하십시오. 그런 다음 새 창에 더 최신 플러그인을 추가하십시오. $$는 새로운 jQuery를 참조합니다. –

답변

관련 문제