用户名: 密码: 免费注册 忘记密码? 网站地图 | 加入收藏 | 设为首页
首页 | 新闻 | 工具 | 系统 | 办公 | 聊天 | 多媒体 | 网页 | 运营 | 平面 | 欣赏 | 数据库 | 程序 | 服务器 | 组网
网页 | 3dmax | Ghost | Windows Xp| Dreamweaver | photoshop | Flash | office | Alexa | Css | QQ | Asp | PHP | Jsp | Access
Flash MX 2004入门 | 网站推广策略 | CorelDRAW入门 | ASP学习 | 网站建设大师功 | Word入门
  iTbulo.com > 学院 > 程序开发教程 > ASP.net教程 > Asp.Net开发技巧 > 文章正文
Ajax无刷新实现图片切换特效
iTbulo.COM 2006-9-20 动态网站制作指南()

一、AjaxMethod
using System;
using System.Data;
using System.Data.SqlClient;

namespace AjaxImage
{
    /**//// <summary>
    /// AjaxMethod 的摘要说明。
    /// </summary>
    public class AjaxMethod
    {
        public AjaxMethod()
        {           
        }
        public static string ConnectionString = System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"].ToString();

        GetDataSet#region GetDataSet
        public static DataSet GetDataSet(string sql)
        {
            SqlDataAdapter sda = new SqlDataAdapter(sql, ConnectionString);
            DataSet ds = new DataSet();
            sda.Fill(ds);
            if (ds != null)
                return ds;
            else
                return null;
        }
        #endregion

        [AjaxPro.AjaxMethod]
        public static DataSet GetPhotoList( int iCategoryID )
        {
            string sql = "Select id,photo_path FROM Photo where photo_category_id=" + iCategoryID ;
            return GetDataSet( sql );
        }
        [AjaxPro.AjaxMethod]
        public static DataSet GetPhotoInfo( int id )
        {
            string sql = string.Format("SELECT photo_title, photo_description FROM Photo WHERE id = {0}", id);
            return GetDataSet( sql );
        }

    }//end class
}

二、页面HTML代码:
<div id="Layer1" style="Z-INDEX:1; LEFT:104px; WIDTH:501px; POSITION:absolute; TOP:28px; HEIGHT:345px">
                <img name="slideShow" src="images/space.gif" width="500" height="300" style="FILTER:revealTrans(duration=2,transition=23)">
            </div>
            <div id="Layer2" style="Z-INDEX:2; LEFT:490px; WIDTH:112px; POSITION:absolute; TOP:380px; HEIGHT:26px">
                <img id="btnPlay" src="images/play_bw.gif" onclick="slideshow_automatic()" onmouseover="this.src='images/play.gif'"
                    onmouseout="this.src='images/play_bw.gif'"> <img id="btnPause" src="images/pause_bw.gif" onclick="pauseSlideShow()" onmouseover="this.src='images/pause.gif'"
                    onmouseout="this.src='images/pause_bw.gif'"> <img id="btnPrev" src="images/prev_bw.gif" onclick="previous_image()" onmouseover="this.src='images/prev.gif'"
                    onmouseout="this.src='images/prev_bw.gif'"> <img id="btnNext" src="images/next_bw.gif" onclick="next_image()" onmouseover="this.src='images/next.gif';next_image()"
                    onmouseout="this.src='images/next_bw.gif'">
            </div>
三、javascript:
<script language="javascript" type="text/javascript">
            // 定时器
            var timeDelay;
           
            // 图片自动浏览时的时间间隔
            var timeInterval = 4000;
           
            // Array对象,存储图片文件的路径
            var image;
           
            // 当前显示的图片序号
            var num;
           
            // 图片信息数据表
            var dt;
            // 预加载图片信息
            function PreloadImage(iCategoryID)
            {
                // 采用同步调用的方式获取图片的信息               
                var ds = AjaxImage.AjaxMethod.GetPhotoList(iCategoryID).value;
               
                // 如果返回了结果
                if (ds)
                {
                    // 判断数据表是否不为空
                    if (ds.Tables[0].Rows.length > 0)
                    {
                        // 返回的图片信息数据表
                        dt = ds.Tables[0];
                       
                        // 用image对象存储图片的文件路径
                        image = new Array();
                       
                        // 图片在Photos目录下
                        for (var i = 0; i < dt.Rows.length; i++)
                        {
                            image[i] = "Photos/" + dt.Rows[i].photo_path;
                        }
                                   
                        // imagePreload对象用于实现图片的预缓存
                        var imagePreload = new Array();
                        for (var i = 0;i < image.length;i++)
                        {
                            // 通过新建Image对象,并将其src属性指向图片的URL
                            // 显现图片的预缓存
                            imagePreload[i] = new Image();
                            imagePreload[i].src = image[i];
                        }

                        // 初始化一些变量
                        num = -1;
                        //nStatus = 0x09;
                       
                        // 加载第一张图片
                        next_image();               
                    }
                    else // 分类下没有图片
                    {
                        alert("该目录下没有图片!");
                    }
                }               
            }

[1] [2] 下一页

文章搜索
相关资讯
相关文章 相关下载
在ASP.NET中上传图片并生成缩略图
Excel在.Net下驻留内存的解决方法
ASP.NET中常用的优化性能方法详解
网友原创:从N层到.NET详细剖析原理
经验之谈:MySQL与ASP.NET配合更强大
焦点信息