带有 iframe 的 Colorbox 关闭按钮

colorbox close button with iframe

本文关键字：关闭按钮 Colorbox iframe 带有      更新时间：2023-09-26

我正在使用颜色框进行模态弹出窗口，弹出窗口的内容来自 URL，因为它显示在 iFrame 中，如何向模态弹出窗口添加关闭按钮？

谢谢

这是彩盒的代码

<a class="Modal" href="http://google.com" onclick="openModal();">Click here</a>

和 js：

var openModal = function (){        
     $(".Modal").colorbox({
         iframe:true, 
         opacity:0.5, 
         scrolling:true, 
         width:832, 
         height:456, 
         top:60
     });
}

尝试将其添加到colorbox-iframe.html 

<input type="button" name="btnClose" value="Close" onclick="parent.$.colorbox.close()" />

我以前从未使用过colorbox，但也许您想通过jQuery在函数中添加关闭按钮：

var openModal = function (){        
     $(".Modal").colorbox({
         iframe:true, 
         opacity:0.5, 
         scrolling:true, 
         width:832, 
         height:456, 
         top:60
     });
     $("<div class='thisClosesTheModal'>Close Modal</div>").appendTo(".Modal");
     // style .thisClosesTheModal to look like a close box
}
// and then the function that closes the modal
$(".thisClosesTheModal").live('click', function(){
   $('Modal').hide();
}
相关文章：