先來說一下光盒是什麼
光盒是就本站上面 那幾篇 宅圖文 中有用到的
點擊圖片 會顯是 大圖片
那這有什麼好的嗎？
還記得上一篇文章嗎？(css簡單又完美 的 幫blog圖片自動縮圖)
縮圖了 然後 想讓別人看大圖怎麼半？
總不可能用個簡單連結 連到原始圖的網址吧
這樣觀看人多不方便 所以 光盒 是最佳的選擇？
接下來教大家 怎麼弄好一個光盒 在自己的網站上
當然不是每張圖都會套用到 光盒上
因為我們不可能 每張圖 都要用到光盒吧
所以 把要用光盒圖片 加上一些語法 就可以囉
第1步：下載js 和 css 檔案
載點：highslide.rar
解壓縮密碼：skybox.pp.ru
解壓縮密碼：skybox.pp.ru
第2步：上傳到自己網站內
第3步：打開 網站的 header.html
header.html 通常是 檔頭 的檔案
也就是 放在這裡面的原始碼 在網站上 每一頁都會出現這個原始碼
當然有些網站 沒有這個
但是 總有可以新增到每頁的選項 或 檔案
把他打開來吧
第4步：插入原始碼~
<script type="text/javascript" src="highslide-with-gallery.js"></script>
<link rel="stylesheet" type="text/css" href="highslide.css" />
<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="highslide-ie6.css" /><![endif]-->
<script type="text/javascript">
hs.graphicsDir = 'http://skyboxs.net/graphics/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.wrapperClassName = 'dark borderless floating-caption';
hs.fadeInOut = true;
hs.dimmingOpacity = .75;
// Add the controlbar
if (hs.addSlideshow) hs.addSlideshow({
//slideshowGroup: 'group1',
interval: 5000,
repeat: false,
useControls: true,
fixedControls: 'fit',
overlayOptions: {
opacity: .6,
position: 'bottom center',
hideOnMouseOut: true
}
});
</script>
第5步：對圖片連結做修改
