colorbox 창에서 javacript/jquery 스크립트 사용하기

colorbox를 사용하여 팝업 창에서 제품을 미리 볼 수 있지만 colorbox 안에 Cloud Zoom을 사용하고 싶습니다. 어떤 이유에서인지 알아낼 수 없는데, 일반 브라우저 창에서 호출 될 때 colorbox 내부에서 작동 할 때 cloudzoom이 작동하지 않습니다. 글을 올리기 전에 약간의 검색을했지만 그 두 개의 스크립트에는별로 관련이 없습니다. 예를 들어, colorbox를 호출 한 후에 onComplete : function()을 사용해야하지만 어떻게해야할지 모르겠습니다.colorbox 창에서 javacript/jquery 스크립트 사용하기

이것은 클라우드 줌이 페이지에서 제대로 작동하지만 colorbox에로드되지 않은 곳에서 만든 테스트 페이지의 코드입니다. link with all the files (js, css)을 사용해 보시기 바랍니다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>Test page</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script type="text/javascript" src="./js/jquery.colorbox-min.js"></script> 
<script type="text/javascript" src="./js/cloud-zoom.1.0.2.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $('a.items').colorbox({ width:"80%", height:"90%", href:function(){ return this.href + " #prodpreview"; }}); 
}); 
</script> 
<link rel="stylesheet" type="text/css" href="./css/cloud-zoom.css" /> 
<link rel="stylesheet" type="text/css" href="./css/colorbox.css" /> 
</head> 
<body> 

<a href="test.php" class="items">Test</a> 

<div id="prodpreview" style="margin-top:20px;"> 
<a href="https://www.google.com/images/srpr/logo3w.png" class="cloud-zoom" id="zoom1" rel="position:'inside', showTitle: false, adjustX:-4, adjustY:-4" style="position:relative; display:block;"> 
<img src="https://www.google.com/images/srpr/logo3w.png" width="150"/> 
</a> 
</div> 
</body> 
</html>

출처

2012-06-28 bikey77

이를 시도해보십시오 HTML에서

이

<a href="#" class="items">Test</a>

와 앵커 태그를 교체하고 스크립트에서이 해결됩니다이

$(document).ready(function() { 
    $('a.items').colorbox({ 
     width:"80%", 
     height:"90%", 
     href:"#prodpreview", 
     inline:true, 
     onComplete:function(){ 
      $('.cloud-zoom, .cloud-zoom-gallery').CloudZoom(); 
     } 
    }); 
});

희망 같은 JQuery와 colorbox 코드를 작성 너의 문제.

출처

2012-06-28 16:32:46

정말 고맙습니다! – bikey77

대체 방법은 ColorBox에서 새로운 html 환경을 본질적으로 여는 ColorBox의 iFrame 옵션을 사용하는 것입니다. 상황이 좋을 것입니다. 이 방법은 당신이 크기 IFrame 콘텐츠 :로 해당 이미지를 얻는 방법 일 필요

주 등에 대해 생각하는

뭔가.

감사합니다. KJM

출처

2012-06-29 15:42:22

아이디어를 주셔서 감사하지만 여러 가지 이유로 iframe 접근 방식을 사용할 수 없습니다. – bikey77

colorbox 창에서 javacript/jquery 스크립트 사용하기

답변

관련 문제