colorbox學習筆記–iframe內嵌頁面調用父頁面colorbox

常常用到iframe內嵌另一個頁面，而這個頁面裡顯示圖片，當點擊這個內嵌頁面中的圖片，讓他在父級頁面顯示colorbox的效果

1.首先iframe內頁面額代碼

js： function colorBox() {            var url = document.getElementById("bigPic").src;            window.parent.showBigPic(url);        }html：<img id="bigPic" src="<%=BigPic %>" ondblclick="colorBox()" alt="" style="width:300px;height:200px;" />

2.外面大頁面

引用： <script type="text/javascript" src="/public/js/jquery-1.4.4.min.js"></script>    <link href="http://www.cnblogs.com/public/ColorBox/colorbox.css" rel="stylesheet" type="text/css" />    <script src="http://www.cnblogs.com/public/ColorBox/jquery.colorbox-min.js" type="text/javascript"></script>js://顯示圖片        function showBigPic(url) {            $.colorbox({ html: "<div><img src='" + url + "'></div>" });            $('div#cboxLoadedContent').css({ "border-bottom": "none", "background": "transparent" });        }

3.大功告成！