使用顏色框窗

我使用顏色框預覽產品中的彈出窗口，但我也想使用Cloud Zoom的顏色框裏面裏面的JavaScript/jQuery的腳本。出於某種原因，我無法弄清楚，cloudzoom無法工作時，顏色框裏面，當它被稱爲在一個普通的瀏覽器窗口工作正常。我在發帖之前進行了一些搜索，但這兩個腳本並沒有太多共同之處。 PERHAPS，我需要在調用colorbox之後使用onComplete：function（），但我不知道該怎麼做。使用顏色框窗

這是我的測試頁我創建在裝入到顏色框，當雲變焦工作正常，在頁面上，但不是代碼。這裏有一個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的顏色框代碼你的問題。

來源

2012-06-28 16:32:46

太謝謝你了，好極了！ – bikey77

另一種方法是使用基本上開在彩盒一個新的HTML環境彩盒的iFrame的選項。那裏的事情應該沒問題。

注意此方法需要你來解決如何才能獲得相應的圖像到iFrame內容，規模等

一些思考。

問候，KJM

來源

2012-06-29 15:42:22

感謝您的想法，但有幾個原因，我不能使用iframe的方法。 – bikey77

使用顏色框窗

回答

相關問題