TiltViewer–網站Flash秀圖
作者:CHOME 日期:2012-05-11
官網
http://www.airtightinteractive.com/projects/tiltviewer/
index.html
swfobject.js
TiltViewer.swf
gallery.xml
[imgs]_擺放圖檔
我新增了
[pic]_擺放大圖檔,原則上以1024*768為準
Small.asp_利用AspJpeg把[pic]的大圖檔,縮小為512*384,並擺放在[img](我不想叫imgs)
make.asp_製作1.xml(我不想叫gallery.xml)
index.html改為index.asp
應用:index.asp後面帶參數,Index.asp?area=x對應到x.xml,那麼就可以製作x本相簿了..
實例示範
我的植栽
http://chome.idv.tw/view/
櫻花相簿
http://www.chome.idv.tw/view/index.asp?area=1
廣末涼子
http://chome.idv.tw/view/index.asp?area=2
創意佈景
http://chome.idv.tw/view/index.asp?area=3
四季野鳥
http://chome.idv.tw/view/index.asp?area=4
盆景園藝
http://chome.idv.tw/view/index.asp?area=5
花與蝴蝶
http://chome.idv.tw/view/index.asp?area=6
昆蟲世界
http://chome.idv.tw/view/index.asp?area=7
紅玫瑰
http://chome.idv.tw/view/index.asp?area=8
建築設計
http://chome.idv.tw/view/index.asp?area=9
比基尼
http://chome.idv.tw/view/index.asp?area=10
index.asp
swfobject.js
TiltViewer.swf
1.xml~x.xml
Make.asp
Small.asp
[img]
[1]~[x]_擺放小圖檔(由small.asp利用AspJpeg產生)
[pic]
[1]~[x]_擺放大圖檔
備註:
支援中文檔名,但xml必需以UTF-8編碼
滑鼠右鍵可開啟全螢幕視窗
XML結構
imageurl:顯示的圖片,以512*384為宜
linkurl:超連結位址
title:因預設字型大小,故以9個中文字為宜
description:支援 [CDATA[ 簡易HTML語法
Index.asp
fo.addVariable("useFlickr", "false");
不使用Flickr
fo.addVariable("xmlURL", "<%=area%>.xml");
調用腳本檔
fo.addVariable("maxJPGSize","512");
顯示圖片的可能最大寬度
fo.addVariable("useReloadButton", "false");
true時只能血前不能後退
fo.addVariable("columns", "5");
顯示幾行圖片
fo.addVariable("rows", "4");
顯示幾列圖片
fo.addParam("allowFullScreen","true");
全螢幕
fo.write("flashcontent");
作用不知道..
製作XML
<%@LANGUAGE="VBscript" CODEPAGE="65001"%>
<%
area=request("area")
IF area="" Then area=11
Session.CodePage=65001
response.CharSet="utf-8"
Set fs = CreateObject("Scripting.FileSystemObject")
oriFolder="img/"&area
oriTestFolder = Server.Mappath(OriFolder)
Set objFolder = FS.GetFolder(OriTestFolder)
Body="<tiltviewergallery>"&vbCrlf
Body=Body&" <photos>"&vbCrlf
I=1
For Each File in objFolder.Files
If Lcase(Right(File.Name,3)) = "jpg" Then
tmp=split(File.Name,".")
fn=replace(File.Name,"."&tmp(ubound(tmp)),"")
fd=File.ParentFolder
Body=Body&" <photo imageurl='img/"&area&"/"&File.Name&"' linkurl='http://www.chome.idv.tw/view/pic/"&area&"/"&File.Name&"'>"&vbCrlf
Body=Body&" <title>Image "&I&"</title>"&vbCrlf
Body=Body&" <description><![CDATA["&getAttr(fd,fn,14)&"]]></description>"&vbCrlf
Body=Body&" </photo>"&vbCrlf
I=I+1
End IF
Next
Body=Body&" </photos>"&vbCrlf
Body=Body&"</tiltviewergallery>"&vbCrlf
filepath="xml/"&area&".xml"
SaveToFile Body,filepath,"utf-8"
'newfilepath=Server.Mappath(filepath)
'Set fout=fs.CreateTextFile(newfilepath)
'fout.WriteLine Body
Response.write "寫入 "&area&".xml 成功<br>"
Response.write "<a href=index.asp?area="&area&">瀏覽</a><br>"
Response.End
'讀取文件所有屬性
function getAttr(folder,filename,i)
'function getAttr(folder,filename)
Set objShell = CreateObject("Shell.Application")
Set objFolder = objShell.Namespace(folder)
Set objFile = objFolder.ParseName(filename)
For Each strFileName in objFolder.Items
if lcase(strFileName) = lcase(filename) then
'For i = -1 to 127
getAttr=objFolder.GetDetailsOf(strFileName, i)
'getAttr=getAttr& i & ". "& objFolder.GetDetailsOf(objFolder.Items, i) & " = " & Replace(objFolder.GetDetailsOf(strFileName, i),chr(10),"<br>") & "<BR>"
'Next
end if
Next
set objshell=nothing
set objFolder=nothing
end function
Function SaveToFile(strBody,File,cSet)
Dim objStream
Set objStream = Server.CreateObject("ADODB.Stream")
With objStream
.Type = 2
.Open
.Charset = cSet
.Position = objStream.Size
.WriteText = strBody
.SaveToFile Server.MapPath(File),2
.Close
End With
Set objStream = Nothing
End Function
%>
程序中的function getAttr是為了取得圖檔的:註解
(利用註解寫入些資訊,譬如那天拍的照用什麼相機或寫下當時的心境等)
在秀圖時呈現底下的效果
http://www.airtightinteractive.com/projects/tiltviewer/
index.html
swfobject.js
TiltViewer.swf
gallery.xml
[imgs]_擺放圖檔
我新增了
[pic]_擺放大圖檔,原則上以1024*768為準
Small.asp_利用AspJpeg把[pic]的大圖檔,縮小為512*384,並擺放在[img](我不想叫imgs)
make.asp_製作1.xml(我不想叫gallery.xml)
index.html改為index.asp
應用:index.asp後面帶參數,Index.asp?area=x對應到x.xml,那麼就可以製作x本相簿了..
實例示範
我的植栽
http://chome.idv.tw/view/
櫻花相簿
http://www.chome.idv.tw/view/index.asp?area=1
廣末涼子
http://chome.idv.tw/view/index.asp?area=2
創意佈景
http://chome.idv.tw/view/index.asp?area=3
四季野鳥
http://chome.idv.tw/view/index.asp?area=4
盆景園藝
http://chome.idv.tw/view/index.asp?area=5
花與蝴蝶
http://chome.idv.tw/view/index.asp?area=6
昆蟲世界
http://chome.idv.tw/view/index.asp?area=7
紅玫瑰
http://chome.idv.tw/view/index.asp?area=8
建築設計
http://chome.idv.tw/view/index.asp?area=9
比基尼
http://chome.idv.tw/view/index.asp?area=10
index.asp
swfobject.js
TiltViewer.swf
1.xml~x.xml
Make.asp
Small.asp
[img]
[1]~[x]_擺放小圖檔(由small.asp利用AspJpeg產生)
[pic]
[1]~[x]_擺放大圖檔
備註:
支援中文檔名,但xml必需以UTF-8編碼
滑鼠右鍵可開啟全螢幕視窗
XML結構
復制內容到剪貼板 歌詞或引言或程序代碼
<tiltviewergallery>
<photos>
<photo imageurl='img/我的植栽/玫瑰11.jpg' linkurl='http://chome.idv.tw/view/pic/我的植栽/玫瑰11.jpg'>
<title>香水玫瑰-甜心</title>
<description><![CDATA[2009-01-29 下午 05:47 Panasonic DMC-FZ30<br><font color="#0000ff" size="28"><b>西風<br> 原是<br> 偶爾駐足於黃葉的舞動<br> 那懂<br> 撐著火輪般玫瑰的吟詠<br> 只因<br> 思念竟化成裸身的玫瑰<br> 竟也<br> 文字忘形如蝴蝶般飛舞<br> 舞出了輕盈絢爛<br> 舞出了狂野繽紛<br> 舞出了今生今世來生來世</b></font>]]></description>
</photo>
<photo imageurl='img/我的植栽/玫瑰20.jpg' linkurl='http://chome.idv.tw/view/pic/我的植栽/玫瑰20.jpg'>
<title>香水無刺玫瑰</title>
<description><![CDATA[2003-03-05 OLYMPUS C750UZ<br><font color="#0000ff" size="36"><b>麝炷騰清燎,鮫紗覆綠蒙。<br>宮妝臨曉日,錦段落東風。<br>無力春煙裡,多愁暮雨中。<br>不知何事意,深淺兩般紅。<br>-- 唐彥謙(唐朝)</b></font>]]></description>
</photo>
<photo imageurl='img/我的植栽/茶花01.jpg' linkurl='http://chome.idv.tw/view/pic/我的植栽/茶花01.jpg'>
<title>山茶花</title>
<description>2009-02-09 下午 03:54 Panasonic DMC-FZ30</description>
</photo>
</photos>
</tiltviewergallery>
<photos>
<photo imageurl='img/我的植栽/玫瑰11.jpg' linkurl='http://chome.idv.tw/view/pic/我的植栽/玫瑰11.jpg'>
<title>香水玫瑰-甜心</title>
<description><![CDATA[2009-01-29 下午 05:47 Panasonic DMC-FZ30<br><font color="#0000ff" size="28"><b>西風<br> 原是<br> 偶爾駐足於黃葉的舞動<br> 那懂<br> 撐著火輪般玫瑰的吟詠<br> 只因<br> 思念竟化成裸身的玫瑰<br> 竟也<br> 文字忘形如蝴蝶般飛舞<br> 舞出了輕盈絢爛<br> 舞出了狂野繽紛<br> 舞出了今生今世來生來世</b></font>]]></description>
</photo>
<photo imageurl='img/我的植栽/玫瑰20.jpg' linkurl='http://chome.idv.tw/view/pic/我的植栽/玫瑰20.jpg'>
<title>香水無刺玫瑰</title>
<description><![CDATA[2003-03-05 OLYMPUS C750UZ<br><font color="#0000ff" size="36"><b>麝炷騰清燎,鮫紗覆綠蒙。<br>宮妝臨曉日,錦段落東風。<br>無力春煙裡,多愁暮雨中。<br>不知何事意,深淺兩般紅。<br>-- 唐彥謙(唐朝)</b></font>]]></description>
</photo>
<photo imageurl='img/我的植栽/茶花01.jpg' linkurl='http://chome.idv.tw/view/pic/我的植栽/茶花01.jpg'>
<title>山茶花</title>
<description>2009-02-09 下午 03:54 Panasonic DMC-FZ30</description>
</photo>
</photos>
</tiltviewergallery>
imageurl:顯示的圖片,以512*384為宜
linkurl:超連結位址
title:因預設字型大小,故以9個中文字為宜
description:支援 [CDATA[ 簡易HTML語法
Index.asp
fo.addVariable("useFlickr", "false");
不使用Flickr
fo.addVariable("xmlURL", "<%=area%>.xml");
調用腳本檔
fo.addVariable("maxJPGSize","512");
顯示圖片的可能最大寬度
fo.addVariable("useReloadButton", "false");
true時只能血前不能後退
fo.addVariable("columns", "5");
顯示幾行圖片
fo.addVariable("rows", "4");
顯示幾列圖片
fo.addParam("allowFullScreen","true");
全螢幕
fo.write("flashcontent");
作用不知道..
製作XML
復制內容到剪貼板 歌詞或引言或程序代碼
<%@LANGUAGE="VBscript" CODEPAGE="65001"%>
<%
area=request("area")
IF area="" Then area=11
Session.CodePage=65001
response.CharSet="utf-8"
Set fs = CreateObject("Scripting.FileSystemObject")
oriFolder="img/"&area
oriTestFolder = Server.Mappath(OriFolder)
Set objFolder = FS.GetFolder(OriTestFolder)
Body="<tiltviewergallery>"&vbCrlf
Body=Body&" <photos>"&vbCrlf
I=1
For Each File in objFolder.Files
If Lcase(Right(File.Name,3)) = "jpg" Then
tmp=split(File.Name,".")
fn=replace(File.Name,"."&tmp(ubound(tmp)),"")
fd=File.ParentFolder
Body=Body&" <photo imageurl='img/"&area&"/"&File.Name&"' linkurl='http://www.chome.idv.tw/view/pic/"&area&"/"&File.Name&"'>"&vbCrlf
Body=Body&" <title>Image "&I&"</title>"&vbCrlf
Body=Body&" <description><![CDATA["&getAttr(fd,fn,14)&"]]></description>"&vbCrlf
Body=Body&" </photo>"&vbCrlf
I=I+1
End IF
Next
Body=Body&" </photos>"&vbCrlf
Body=Body&"</tiltviewergallery>"&vbCrlf
filepath="xml/"&area&".xml"
SaveToFile Body,filepath,"utf-8"
'newfilepath=Server.Mappath(filepath)
'Set fout=fs.CreateTextFile(newfilepath)
'fout.WriteLine Body
Response.write "寫入 "&area&".xml 成功<br>"
Response.write "<a href=index.asp?area="&area&">瀏覽</a><br>"
Response.End
'讀取文件所有屬性
function getAttr(folder,filename,i)
'function getAttr(folder,filename)
Set objShell = CreateObject("Shell.Application")
Set objFolder = objShell.Namespace(folder)
Set objFile = objFolder.ParseName(filename)
For Each strFileName in objFolder.Items
if lcase(strFileName) = lcase(filename) then
'For i = -1 to 127
getAttr=objFolder.GetDetailsOf(strFileName, i)
'getAttr=getAttr& i & ". "& objFolder.GetDetailsOf(objFolder.Items, i) & " = " & Replace(objFolder.GetDetailsOf(strFileName, i),chr(10),"<br>") & "<BR>"
'Next
end if
Next
set objshell=nothing
set objFolder=nothing
end function
Function SaveToFile(strBody,File,cSet)
Dim objStream
Set objStream = Server.CreateObject("ADODB.Stream")
With objStream
.Type = 2
.Open
.Charset = cSet
.Position = objStream.Size
.WriteText = strBody
.SaveToFile Server.MapPath(File),2
.Close
End With
Set objStream = Nothing
End Function
%>
程序中的function getAttr是為了取得圖檔的:註解
(利用註解寫入些資訊,譬如那天拍的照用什麼相機或寫下當時的心境等)
在秀圖時呈現底下的效果
[本日志由 CHOME 於 2012-05-11 08:38 PM 更新]
上一篇: 紫藤掛雲木花蔓宜陽春下一篇: ASP要如何查詢檔案的摘要??
文章來自: 本站原創
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相關日志:
評論: 0 | 引用: 0 | 查看次數: -
發表評論