幻燈片展示特效Lytebox Slideshow
作者:CHOME 日期:2013-06-30
Lytebox可以作:影片網頁圖片幻燈片展示特效,但因為一心不能二用的緣故,影片和網頁比較不實際,圖片幻燈片展示,就不會想要一心二用了,故拿來部落格使用!!
先把從網路下載回來的lytebox解壓後,lytebox目錄裡頭包括,lytebox.css,lytebox.js和一個images次目錄,擺放在適當的位置(位置隨便你放,只要找得到就行)
簽入後台管理-介面與插件-編輯靜態頁面模版(因為我是使用全靜態模式)
把lytebox.css,lytebox.js插入
<HEAD>與</HEAD>插入
<script type="text/javascript" language="javascript" src="lytebox.js"></script>
<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />
如下圖
語法:
<a href="images/image-1.jpg" class="lytebox"
data-lyte-options="slide:true group:vacation" data-title="一代佳人Generation Beauty"><img src=images/image-1.jpg border=0 alt=""></a>
<a href="images/image-2.jpg" class="lytebox"
data-lyte-options="slide:true group:vacation" data-title="一棒粉Yi Bang Fen"><img src=images/image-2.jpg border=0 alt=""></a>
用法:
(Lytebox=註解說明).... (/Lytebox)
打開common/ubbcode.asp,作一些修改
If Not DisUBB = 1 Then
If Not DisIMG = 1 Then
後面插入
re.Pattern = "\[Lytebox=(.[^\]]*)\](.[^\]]*)\[\/Lytebox]"
Set strMatchs = re.Execute(strContent)
For Each strMatch in strMatchs
tmpStr1 = strMatch.SubMatches(0)
tmpStr2 = strMatch.SubMatches(1)
strContent = Replace(strContent, strMatch.Value, "<a href="""&tmpStr2&""" class=""lytebox"" data-lyte-options=""slide:true group:rose slideInterval:2000 loopSlideshow:true"" data-title="""&tmpStr1&""" ><img src="""&tmpStr2&""" border=""0"" width=""520""></a>", 1, -1, 0)
Next
re.Pattern = "(\[lytebox\])(.[^\]]*)\[\/lytebox\]"
Set strMatchs = re.Execute(strContent)
For Each strMatch in strMatchs
tmpStr1 = strMatch.SubMatches(1)
strContent = Replace(strContent, strMatch.Value, "<a href="""&tmpStr1&""" class=""lytebox"" data-lyte-options=""slide:true group:rose slideInterval:2000 loopSlideshow:true"" data-title=""LyteBox"" ><img src="""&tmpStr1&""" border=""0"" width=""520""></a>", 1, -1, 0)
Next
實例示範
Youtube影音
失戀無罪 - A-Lin&關詩敏
囚鳥 - 關詩敏
先把從網路下載回來的lytebox解壓後,lytebox目錄裡頭包括,lytebox.css,lytebox.js和一個images次目錄,擺放在適當的位置(位置隨便你放,只要找得到就行)
簽入後台管理-介面與插件-編輯靜態頁面模版(因為我是使用全靜態模式)
把lytebox.css,lytebox.js插入
復制內容到剪貼板 歌詞或引言或程序代碼
<HEAD>與</HEAD>插入
<script type="text/javascript" language="javascript" src="lytebox.js"></script>
<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />
如下圖
復制內容到剪貼板 歌詞或引言或程序代碼
語法:
<a href="images/image-1.jpg" class="lytebox"
data-lyte-options="slide:true group:vacation" data-title="一代佳人Generation Beauty"><img src=images/image-1.jpg border=0 alt=""></a>
<a href="images/image-2.jpg" class="lytebox"
data-lyte-options="slide:true group:vacation" data-title="一棒粉Yi Bang Fen"><img src=images/image-2.jpg border=0 alt=""></a>
用法:
(Lytebox=註解說明).... (/Lytebox)
打開common/ubbcode.asp,作一些修改
復制內容到剪貼板 歌詞或引言或程序代碼
If Not DisUBB = 1 Then
If Not DisIMG = 1 Then
後面插入
復制內容到剪貼板 歌詞或引言或程序代碼
re.Pattern = "\[Lytebox=(.[^\]]*)\](.[^\]]*)\[\/Lytebox]"
Set strMatchs = re.Execute(strContent)
For Each strMatch in strMatchs
tmpStr1 = strMatch.SubMatches(0)
tmpStr2 = strMatch.SubMatches(1)
strContent = Replace(strContent, strMatch.Value, "<a href="""&tmpStr2&""" class=""lytebox"" data-lyte-options=""slide:true group:rose slideInterval:2000 loopSlideshow:true"" data-title="""&tmpStr1&""" ><img src="""&tmpStr2&""" border=""0"" width=""520""></a>", 1, -1, 0)
Next
re.Pattern = "(\[lytebox\])(.[^\]]*)\[\/lytebox\]"
Set strMatchs = re.Execute(strContent)
For Each strMatch in strMatchs
tmpStr1 = strMatch.SubMatches(1)
strContent = Replace(strContent, strMatch.Value, "<a href="""&tmpStr1&""" class=""lytebox"" data-lyte-options=""slide:true group:rose slideInterval:2000 loopSlideshow:true"" data-title=""LyteBox"" ><img src="""&tmpStr1&""" border=""0"" width=""520""></a>", 1, -1, 0)
Next
實例示範
Youtube影音
失戀無罪 - A-Lin&關詩敏
囚鳥 - 關詩敏
[本日志由 CHOME 於 2013-07-08 02:36 AM 更新]
上一篇: 瞭了梅??下一篇: 環曾文水庫單車自由
文章來自: 本站原創
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相關日志:
評論: 0 | 引用: 0 | 查看次數: -
發表評論