图象弹出层

最新推荐文章于 2022-08-30 22:40:07 发布

Andy__Huang

最新推荐文章于 2022-08-30 22:40:07 发布

阅读量671

点赞数

分类专栏： .NET程序文章标签： assembly string function null class filter

本文链接：https://blog.csdn.net/hdhai9451/article/details/7814982

版权

.NET程序专栏收录该内容

72 篇文章 1 订阅

订阅专栏

1. CS文件

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web.UI;
using System.Drawing;
using System.ComponentModel;
using System.Drawing.Design;
using GlacierCLI.Web.WebControls.ClientResource;

namespace GlacierCLI.Web.WebControls
{
    [ClientResource(ClientResourceType.CssFile, "GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.ImageThumbViewer.css")]
    [ClientResource(ClientResourceType.ScriptFile, "GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.ImageThumbViewer.js")]
    [ToolboxData("<{0}:ImageThumbViewer runat=\"server\" OriginalImageURL=\"\" Title=\"\" Width=\"100\" Height=\"100\" />")]
    [ToolboxBitmap(typeof(System.Web.UI.WebControls.Image))]
    public class ImageThumbViewer : Control
    {
        public string ToolTip
        {
            get
            {
                return ViewState["ToolTip"] == null ?
                    string.Empty : ViewState["ToolTip"].ToString();
            }
            set
            {
                ViewState["ToolTip"] = value;
            }
        }
        public int ImageBoxWidth
        {
            get
            {
                return ViewState["ImageBoxWidth"] == null ? 800 : (int)ViewState["ImageBoxWidth"];
            }
            set
            {
                ViewState["ImageBoxWidth"] = value;
            }
        }
        public int ImageBoxHeight
        {
            get
            {
                return ViewState["ImageBoxHeight"] == null ? 600 : (int)ViewState["ImageBoxHeight"];
            }
            set
            {
                ViewState["ImageBoxHeight"] = value;
            }
        }
        public int Width
        {
            get
            {
                return ViewState["Width"] == null ? 100 : (int)ViewState["Width"];
            }
            set
            {
                ViewState["Width"] = value;
            }
        }
        public int Height
        {
            get
            {
                return ViewState["Height"] == null ? 100 : (int)ViewState["Height"];
            }
            set
            {
                ViewState["Height"] = value;
            }
        }
        [Category("Appearance")]
        [Editor("System.Web.UI.Design.ImageUrlEditor, System.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a", typeof(UITypeEditor))]
        [UrlProperty]
        [Description("Image_ImageUrl")]
        [Bindable(true)]
        [DefaultValue("")]
        public string OriginalImageURL
        {
            get
            {
                return ViewState["OriginalImageURL"] == null ?
                    string.Empty : ViewState["OriginalImageURL"].ToString();
            }
            set
            {
                ViewState["OriginalImageURL"] = value;
            }
        }
        private string ThumbImageURL
        {
            get
            {
                return this.ThumbImageHandlerURL + "?f=" + this.OriginalImageURL + "&w=" + this.Width + "&h=" + this.Height;
            }
        }

        public string ThumbImageHandlerURL
        {
            get
            {
                if (ViewState["ThumbImageHandlerURL"] == null)
                {

                    return string.Empty;
                }
                else
                {
                    return ViewState["ThumbImageHandlerURL"] as string;
                }
            }
            set
            {
                ViewState["ThumbImageHandlerURL"] = value;
            }
        }
        [Category("Appearance")]
        [DefaultValue("")]
        [Description("WebControl_CSSClassName")]
        [CssClassProperty]
        public virtual string CssClass
        {
            get
            {
                return ViewState["CssClass"] == null ?
                    string.Empty : ViewState["CssClass"].ToString();
            }
            set
            {
                ViewState["CssClass"] = value;
            }
        }
        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            ClientResourceUtility.RegisterClientResources(this);
        }

        protected override void Render(HtmlTextWriter writer)
        {
            if (string.IsNullOrWhiteSpace(this.CssClass))
            {
                writer.Write(string.Format(@"<img src=""{0}"" οnclick=""glacier_ImageBox_Show('{3}',{4},{5});"" style=""cursor:pointer;width:{1}px;Height:{2}px"" Title=""{6}"">", this.ThumbImageURL, this.Width, this.Height, this.OriginalImageURL, this.ImageBoxWidth, this.ImageBoxHeight, this.ToolTip));
            }
            else
            {
                writer.Write(string.Format(@"<img src=""{0}"" οnclick=""glacier_ImageBox_Show('{3}',{4},{5});"" style=""cursor:pointer;width:{1}px;Height:{2}px"" Title=""{6}"" class=""{7}"">", this.ThumbImageURL, this.Width, this.Height, this.OriginalImageURL, this.ImageBoxWidth, this.ImageBoxHeight, this.ToolTip, this.CssClass));
            }
        }
    }
}

2. JS文件

var glacier_ImageBox_BackCover = null;
var glacier_ImageBox_Content = null;
var glacier_ImageBox_CloseURL = '<%=WebResource("GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.close.gif")%>';
var glacier_ImageBox_StepIndex = 1;
function glacier_ImageBox_Show(bigImageUrl, width, height) {
    glacier_ImageBox_BackCover = document.createElement("div");
    glacier_ImageBox_Content = document.createElement("div");
    glacier_ImageBox_BackCover.className = "glacier_ImageBox_BackCover";
    glacier_ImageBox_Content.className = "glacier_ImageBox_Content";

3. CSS文件

/*opacity：不透明度，范围是0—100，0表示完全透明，100表示完全不透明。*/

div.glacier_ImageBox_BackCover
{
    filter: alpha(opacity=0);
    opacity: 0.0;
    background: #000;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 101;
    color: Red;
}
div.glacier_ImageBox_Content
{
    filter: alpha(opacity=50);
    opacity: 0.5;
    position: fixed;
    left: 0px;
    top: 100px;
    width: 100%;
    z-index: 102;
    width: 100%;
    height: 100%;
}
div.glacier_ImageBox_Content .ImageWrapper
{
    margin: auto;
    background:white;
    text-align:center;
    border:solid 1px #CECECE;
}
div.glacier_ImageBox_Content .ImageWrapperTop
{
    vertical-align: middle;
    text-align: center;
    background: white url(<%=WebResource("GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.downloading.gif")%>) no-repeat center;
}
div.glacier_ImageBox_Content .ImageWrapperBottom
{
    vertical-align: middle;
    text-align: right;
    padding-right:15px;
}
div.glacier_ImageBox_Content > .CloseBox
{
    margin: auto;
    text-align: center;
    background: white;
}

4. AssemblyInfo文件

#region [Resources]
using System.Web.UI;
[assembly: WebResource("GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.close.gif", "image/gif")]
[assembly: WebResource("GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.downloading.gif", "image/gif")]
[assembly: WebResource("GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.ImageThumbViewer.js", "application/x-javascript", PerformSubstitution = true)]
[assembly: WebResource("GlacierCLI.Web.WebControls.ImageThumbViewer.Resources.ImageThumbViewer.css", "text/css", PerformSubstitution = true)]

#endregion