flash+xml图片轮询显示。
主要实现，flash+xml数据源的图片轮选显示。
需要用到页面：default.aspx (用于显示加载的效果)，ImgageList.aspx(读取显示XML文件),ModifyImg.aspx（添加，修改新的数据）。
default.aspx页面效果：
ImgaeList.aspx页面效果：
ModifyImg.aspx页面效果：
default.aspx页面的 html代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>显示效果</title>
<script type="text/javascript" src="js/swfobject.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div id="flashcontent" style="width:304px; height:209px; font-size:14px; font-weight:700;"></div>
<script type="text/javascript">
var so = new SWFObject("flash/focus.swf?xmlPath=xml/data.xml", "sotester", "304", "209", "7", "#000000");
so.addParam("allowFullScreen", "true");
so.addParam("menu", "false");
so.addParam("wmode", "transparent");
so.write("flashcontent");
</script>
</form>
</body>
</html>
ImageList.aspx的页面 html 代码。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ImageList.aspx.cs" Inherits="ImageList" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>图片列表</title>
<script type="text/javascript">
//弹出页面窗口。
function dialog(title, url, w, h, approot, link,linktarget)
{
var titleheight = 25; // 提示窗口标题高度
var bordercolor = "#668899"; // 提示窗口的边框颜色
var titlecolor = "#404040"; // 提示窗口的标题颜色
var bgcolor = " #E1E1FF"; // 提示内容的背景色
var iWidth = document.documentElement.clientWidth;
var iHeight = document.documentElement.clientHeight;
var Occlusion=document .createElement("div");
Occlusion = document.createElement("div");
Occlusion.setAttribute("id","Occlusion");
Occlusion.style.background = "#000";
Occlusion.style.width = "100%";
Occlusion.style.height = "100%";
Occlusion.style.position = "absolute";
Occlusion.style.top = "0";
Occlusion.style.left = "0";
Occlusion.style.zIndex = "100";
Occlusion.style.opacity = "0.3";
Occlusion.style.filter = "Alpha(opacity=30)";
document.body.appendChild(Occlusion);
var msgObj = document.createElement("div");
msgObj.style.cssText = "position:absolute;font:11px '宋体';top:" + (document.documentElement.scrollTop + (iHeight - h) / 2) + "px;left:" + (document.documentElement.scrollLeft + (iWidth - w) / 2) + "px;width:" + w + "px;text-align:center;border:1px solid " + bordercolor + ";background:" + bgcolor + ";padding:0;margin:0;z-index:102;";
document.body.appendChild(msgObj);
var titleBar = document.createElement("div");
titleBar.style.cssText = "width:" + (parseInt(w) - 27) + "px;height:" + (titleheight - 6) + "px;float:left;text-align:left;margin:0px;padding: 6px 0 0 10px;font:bold 13px '宋体';color:" + titlecolor + ";border:0px solid " + bordercolor + ";cursor:move;background:url(" + approot + "images/bt_bg.gif) repeat-x 0 0;";
titleBar.innerHTML = title;
msgObj.appendChild(titleBar);
var moveX = 0;
var moveY = 0;
var moveTop = 0;
var moveLeft = 0;
var moveable = false;
var docMouseMoveEvent = document.onmousemove;
var docMouseUpEvent = document.onmouseup;
titleBar.onmousedown = function() {
var evt = getEvent();
moveable = true;
moveX = evt.clientX;
moveY = evt.clientY;
moveTop = parseInt(msgObj.style.top);
moveLeft = parseInt(msgObj.style.left);
document.onmousemove = function() {
if (moveable) {
var evt = getEvent();
var x = moveLeft + evt.clientX - moveX;
var y = moveTop + evt.clientY - moveY;
if (x > document.documentElement.scrollLeft && (x - document.documentElement.scrollLeft + w < iWidth) && y > document.documentElement.scrollTop && (y - document.documentElement.scrollTop + parseInt(h) < iHeight)) {
msgObj.style.left = x + "px";
msgObj.style.top = y + "px";
}
}
};
document.onmouseup = function() {
if (moveable) {
document.onmousemove = docMouseMoveEvent;
document.onmouseup = docMouseUpEvent;
moveable = false;
moveX = 0;
moveY = 0;
moveTop = 0;
moveLeft = 0;
}
};
}
var closeBtn = document.createElement("div");
closeBtn.style.cssText = "float:left;width:17px;height:" + titleheight + "px;cursor:pointer; text-align:right; margin:0;padding:0;background:url(" + approot + "images/bt_bg.gif) repeat-x 0 0;";
closeBtn.innerHTML = "<span style='float:right;padding:0;margin: 0 10px 0 0; overflow:hidden;width:7px;height:" + titleheight + "px; background:url(" + approot + "images/bt_shut.gif) no-repeat 0 0;'> </span>";
msgObj.appendChild(closeBtn);
closeBtn.onclick = function() {
document.body.removeChild(msgObj);
document.body.removeChild(Occlusion);
window .location.reload();
}
closeBtn.childNodes[0].onmouseover = function() {
closeBtn.childNodes[0].style.background = "url(" + approot +"images/bt_shut.gif) no-repeat 0 -25px";
}
closeBtn.childNodes[0].onmouseout = function() {
closeBtn.childNodes[0].style.background = "url(" + approot + "images/bt_shut.gif) no-repeat 0 0";
}
var msgBox = document.createElement("div");
msgBox.style.cssText = "float:left;padding:0;margin:0;font:10pt '宋体';";
msgBox.colSpan = 3;
msgBox.innerHTML = "<iframe id=\"iframeurl\" style=\"width:" + w + "px; height:" + (parseInt(h)) + "px;margin:0;padding:0 0 3px 0;overflow:hidden;\" src=\"" + url + "\" frameborder=\"0\" scrolling=\"auto\" ></iframe>";
msgObj.appendChild(msgBox);
// 获得事件Event对象，用于兼容IE和FireFox
function getEvent() {
return window.event || arguments.callee.caller.arguments[0];
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="top">
<input type="button" value="添加" onclick="dialog('添加图片', 'ModifyImg.aspx',336, 193, '') " />
<input id="yulan" type="button" onclick="window.open('Default.aspx')" value="预览" />
</div>
<div id="source">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
BackColor="White" BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px"
CellPadding="4" ForeColor="Black" GridLines="Vertical"
onrowdeleting="GridView1_RowDeleting"
onrowdatabound="GridView1_RowDataBound">
<FooterStyle BackColor="#CCCC99" />
<RowStyle BackColor="#F7F7DE" />
<Columns>
<asp:BoundField DataField="mytitle" HeaderText="标题" />
<asp:ImageField DataImageUrlField="mypic" HeaderText=" 图片">
</asp:ImageField>
<asp:BoundField DataField="links" HeaderText="链接" />
<asp:TemplateField HeaderText="修改" ShowHeader="False">
<ItemTemplate>
<input type="button" id="mod" runat="server" value="修改" />
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField HeaderText="删除" ShowDeleteButton="True" />
</Columns>
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
</div>
</div>
</form>
</body>
</html>
imgaelist.aspx的服务器端代码：
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class ImageList : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
BindSource();
}
void BindSource()
{
DataSet ds = new DataSet();
ds.ReadXml(Server .MapPath("xml/data.xml"));
if (ds.Tables.Count == 2)
{
this.GridView1.DataSource = ds.Tables[1].DefaultView;
this.GridView1.DataBind();
}
}
//删除图片
void DeleteFile(string filePath)
{
if (System.IO.File.Exists(Server.MapPath(filePath)))
System.IO.File.Delete(Server.MapPath(filePath));
}
protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
DataSet ds = new DataSet();
ds.ReadXml(Server.MapPath("xml/data.xml"));
if (ds.Tables[1].Rows.Count < 2)
{
Page.RegisterStartupScript("", "<script>alert('必须保留一个值！')</script>");
return;
}
DeleteFile(ds.Tables[1].Rows[e.RowIndex]["mypic"].ToString().Trim());
ds.Tables[1].Rows.RemoveAt(e.RowIndex);
ds.WriteXml(Server.MapPath("xml/data.xml"));
if (ds.Tables.Count == 2)
{
this.GridView1.DataSource = ds.Tables[1].DefaultView;
this.GridView1.DataBind();
}
}
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
HtmlInputButton btn = (HtmlInputButton)e.Row.FindControl("mod");
btn.Attributes.Add("onclick", "dialog('添加图片', 'ModifyImg.aspx?type="+e .Row .RowIndex+"',336, 193, '')");
}
}
}
modifyImg.aspx的html 代码。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ModifyImg.aspx.cs" Inherits="ModifyImg" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>修改/添加图片</title>
<style type="text/css">
td
{
padding-top:10px;
}
</style>
<script type="text/javascript">
function cancle()
{
var occlus=window .parent .document.getElementById("Occlusion");
if (occlus)
{
window .parent .document.body .removeChild(occlus);
window .parent.location.reload();
}
}
</script>
</head>
<body style="background-color: #E1E1FF">
<form id="form1" runat="server">
<div>
<table style="height:141px;">
<tr style="height:33px;">
<td>标题：</td>
<td><input runat="server" id="biaoti" name="biaoti" type="text" style="width:180px;" /></td>
</tr>
<tr style="height:33px;">
<td>链接：</td>
<td><input runat="server" id="lianjie" name="lianjie" type="text" style="width:180px;" /></td>
</tr>
<tr style="height:33px;">
<td>图片：</td>
<td><input runat="server" runat="server" id="tupian" name="tupian" type="file" style="width:260px;" /></td>
</tr>
<tr style="height:33px;">
<td colspan="2" align="center"><input type="submit" style="background-image:url(images/btn.gif); repeat-x 0 0; border:1px solid #ACACAC;height:23px; width:80px;" value="确定" />
<input type="button" style="background-image:url(images/btn.gif); repeat-x 0 0; border:1px solid #ACACAC;height:23px; width:80px;" value="取消" onclick="cancle()" /></td>
</tr>
</table>
</div>
</form>
</body>
</html>
服务器端代码为：
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class ModifyImg : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
DataSet ds = new DataSet();
ds.ReadXml(Server.MapPath("xml/data.xml"));
if (Request.QueryString["type"] == null && Request.Form.Count > 0)
{
if (ds.Tables.Count == 2 && ds.Tables[1].Rows.Count < 7)
{
DataRow dr = ds.Tables[1].NewRow();
dr[0] = Request.Form["biaoti"].Trim();
dr[2] = Request.Form["lianjie"].Trim();
string name = System.IO.Path.GetFileName(tupian.PostedFile.FileName);
string ImgPath = "images/" + name;
tupian.PostedFile.SaveAs(Server.MapPath(ImgPath));
dr[1] = ImgPath;
dr[3] = 0;
ds.Tables[1].Rows.Add(dr);
ds.WriteXml(Server.MapPath("xml/data.xml"));
}
}
else if (Request.QueryString["type"] != null && Request.Form.Count== 0)
{
int index =int.Parse ( Request.QueryString["type"].Trim());
if (ds.Tables.Count == 2 && ds.Tables[1].Rows.Count < 7)
{
DataRow dr = ds.Tables[1].Rows[index];
biaoti .Value = dr[0].ToString();
lianjie .Value = dr[2].ToString();
}
}
else if (Request.QueryString["type"] != null && Request.Form.Count > 0)
{
int index = int.Parse(Request.QueryString["type"].Trim());
if (ds.Tables.Count == 2 && ds.Tables[1].Rows.Count < 7)
{
DataRow dr = ds.Tables[1].Rows[index];
dr[0]=biaoti.Value;
dr[2]=lianjie.Value;
if (!string.IsNullOrEmpty(tupian.PostedFile.FileName))
{
System.IO.File.Delete(Server.MapPath(dr[1].ToString()));
dr[1] = "images/" + System.IO.Path.GetFileName(tupian.PostedFile.FileName);
tupian.PostedFile.SaveAs(Server.MapPath(dr[1].ToString()));
}
dr[3] = 0;
ds.WriteXml(Server.MapPath("xml/data.xml"));
}
}
}
}
代码只为实现功能，没做任何优化。
