我使用colorbox單擊某個鏈接時顯示單獨的本地文檔。這個問題,我從來沒有做過,所以它可能是顯而易見的,我不能得到彈出的頁面樣式與CSS。我不知道這是如何工作的,彈出的頁面會使用調用它的頁面的CSS進行樣式化?我以爲我不能或不需要讓彈出文檔具有標題或正文標籤。我也想這樣做,而不使用iframe。使用colorbox顯示單獨的文檔
這是我的HTML選擇:
<li class="event priority1">
<a href="detail_img.html" class="cbox-popup">
<div class="content">Lorem Ipsum dolor sit amet, consectetur adipiscing elit.</div>
<div class="lower">
<hr>
<span class="date">03.13.2012</span>
<span class="type">Regulation</span>
<img src="img/icon-lg-financial.png" alt="" height="19" width="26" />
</div>
</a>
</li>
,它應該加載該文件是:
<div class="popup wrap">
<div id="content">
<header>
<h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>
<div class="info">
<time datetime="">05.10.2012</time>
<h2>Legislation</h2>
<img src="img/icon-popup-health.png" alt="" width="20" height="18" />
</div>
</header>
<div class="inner">
<img src="img/popup_img-fullSizeplaceholder.gif" alt="" width="765" height="491" />
</div>
</div>
</div>
最後我使用的是javasript:
<script>
jQuery(function() {
jQuery('.cbox-popup').colorbox({maxWidth: '75%'});
});
</script>
所以,如果我沒有標題和主體標籤,文檔彈出,但它是無風格的。如果我有一個完整的html標題和body標籤沒有顯示的文檔。
你不應該把'div'放在'a'裏面,在這裏看到更多信息:http://stackoverflow.com/questions/1827965/is-putting-a-div-inside-an-anchor-ever-正確 – WhyNotHugo 2012-08-10 14:42:21
幸運的是我使用的是html5,並且在規範中允許使用。 :-) – xoam 2012-08-10 14:50:07
不知道。 :P – WhyNotHugo 2012-08-10 14:51:54