一个自动动态播放图片的类

最新推荐文章于 2022-02-09 11:31:06 发布
最新推荐文章于 2022-02-09 11:31:06 发布
阅读量1.3k 收藏 1
点赞数
分类专栏： C#学习 文章标签： image function border string list javascript
第一步：创建一个类clsTurnPicture

增加方法如下　：

/// <summary>
        /// 播放图片类(downmoon)
        /// </summary>
        /// <param name="arrImgName">arrImgName</param>
        /// <param name="arrDesc">arrDesc</param>
        /// <param name="strShopName">strShopName</param>
        /// <param name="strBrandName">strBrandName</param>
        /// <param name="strResoourceCode">strResoourceCode</param>
        /// <param name="ScrWidth">ScrWidth</param>
        /// <param name="ScrHeight">ScrHeight</param>
        /// <param name="PicWidth">PicWidth</param>
        /// <param name="PicHeight">PicHeight</param>
        /// <param name="TextHeight">TextHeight</param>
        /// <param name="ToolBarHeight">ToolBarHeight</param>
        /// <param name="FontSize">默认为16,px</param>
        /// <returns></returns>
        public string getPicsForHtml(ArrayList arrImgName,ArrayList arrDesc,string strShopName,string strBrandName,string strResoourceCode,int ScrWidth,int ScrHeight,int PicWidth,int PicHeight,int TextHeight,int ToolBarHeight,int FontSize)
        { 
             StringBuilder sb = new StringBuilder();
            string strHtml="";
            if(arrImgName==null) return "" ;
            ArrayList ar1=new ArrayList(arrImgName);
            ArrayList ar2=new ArrayList(arrDesc);
            int len=ar1.Count;
            int len2=ar1.Count-1;
            int len3=ToolBarHeight-2;
            string str1="";
            string str2="";

            //strHtm+=@"   <html><head><title>Buynow{0}-{1}-{2}图片信息</title>
            strHtml=@"<!DOCTYPE HTML PUBLIC ""-//W3C//DTD HTML 4.0 Transitional//EN"" ><HTML><HEAD><title>"+    strShopName+"-"+strBrandName+"-"+"席位："+strResoourceCode+   "-外观展示图"+
                @"</title>
        <meta http-equiv=""content-type"" content=""text/html; charset=gb2312"">
        <meta name=""GENERATOR"" Content=""Microsoft Visual Studio .NET 7.1"">
        <meta name=""CODE_LANGUAGE"" Content=""C#"">
        <meta name=""vs_defaultClientScript"" content=""JavaScript"">
        <meta name=""vs_targetSchema"" content=""http://schemas.microsoft.com/intellisense/ie5"">  "+System.Environment.NewLine;

            sb.Append(strHtml);
            sb.Append("<script language=JavaScript>"+"/r/n");
            sb.Append("<!-- Begin"+System.Environment.NewLine);
            sb.Append("var interval = 6; // delay between rotating images (in seconds)"+System.Environment.NewLine);
            sb.Append("interval *= 1000;"+System.Environment.NewLine);
            sb.Append("var flagtime=0;"+System.Environment.NewLine);
            sb.Append("var image_index = -1;"+System.Environment.NewLine);
            sb.Append("image_list = new Array();"+System.Environment.NewLine);
            sb.Append("note_list = new noteArray("+len2.ToString()+")"+System.Environment.NewLine);
            sb.Append("var number_of_image = image_list.length;"+System.Environment.NewLine);
            sb.Append("var timesnum=0;    "+System.Environment.NewLine);
            //strHtml=string.Format(strHtml,len.ToString());
            string strTemp="";
            for(int k=0;k<ar1.Count;k++)
            {
                strTemp=ar1[k].ToString();
                //strHtm+=" image_list[k] = new imageItem(/"+strTemp+/")";
                str1+=" image_list["+k.ToString()+"] = new imageItem(/""+strTemp+"/")"+";/r/n";
            }
            sb.Append(""+System.Environment.NewLine);
            for(int k=0;k<ar2.Count;k++)
            {
                strTemp=strShopName+"-"+strBrandName+"-"+strResoourceCode+"-"+ar2[k].ToString();
                str2+=" note_list["+k.ToString()+"] = /""+strTemp+"/""+";/r/n";
            }
            sb.Append(str1);
            sb.Append(str2);
            sb.Append("function noteArray(size)"+System.Environment.NewLine);
            sb.Append("{"+System.Environment.NewLine);
            sb.Append("this.length=size;"+System.Environment.NewLine);
            sb.Append("for(i=1;i<=size;i++)"+System.Environment.NewLine);
            sb.Append("{"+System.Environment.NewLine);
            sb.Append(@"this[i]="""""+System.Environment.NewLine);
            sb.Append("    }"+System.Environment.NewLine);
            sb.Append("return this;"+System.Environment.NewLine);
            sb.Append("}"+System.Environment.NewLine);
            sb.Append("function counternum()"+System.Environment.NewLine);
            sb.Append("{"+System.Environment.NewLine);
            sb.Append("if( timesnum < "+len2.ToString()+")"+System.Environment.NewLine);
            sb.Append("{"+System.Environment.NewLine);
            sb.Append("    timesnum++;"+System.Environment.NewLine);
            sb.Append(@"//document.all.slide_ent.src=""about:blank"";");
            sb.Append(System.Environment.NewLine);
           
            sb.Append(@"//document.all.slide_ent.src=""about:blank"";");
            sb.Append(System.Environment.NewLine);
            sb.Append("    }"+System.Environment.NewLine);
            sb.Append("}"+System.Environment.NewLine);
            sb.Append(@"function run(obj)
                            {
                                interval=obj.options[obj.selectedIndex].value*1000;
                                rotateImage();
                            }");
            sb.Append(@"function stop()
                    {
                        interval=0;
                    }
                    function previous()
                    {
                        var new_image = getPreviousImage();
                        document[""rImage""].src = new_image;
                    }
                    function next()
                        {
                            var new_image = getNextImage();
                            document[""rImage""].src = new_image;
                        }
                        function imageItem(image_location)
                        {
                            this.image_item = new Image();
                            this.image_item.src = image_location;
                        }
                        function noteItem(note)
                        {
                            this.note_item = new Image();
                            this.note_item.src = note;
                        }
                        function get_ImageItemLocation(imageObj)
                        {
                            return(imageObj.image_item.src)
                            }
                        function get_NoteItemLocation(noteObj)
                        {
                            return(noteObj.note_item.src)
                            }
                        function generate(x, y)
                        {
                            var range = y - x + 1;
                            return Math.floor(Math.random() * range) + x;
                        }");
            sb.Append(@"function getPreviousImage()
                        {
                            image_index = image_index-1;
                            if (image_index < 0)
                            {");
            sb.Append("image_index=image_index+"+len.ToString()+";");
            sb.Append(@"}
                var new_image = get_ImageItemLocation(image_list[image_index]);
                document.all.span_1.innerText=image_index+1;
                document.all.summary.innerText=note_list[image_index];
                return(new_image);");
            sb.Append(System.Environment.NewLine+"}");
            sb.Append(@"function getNextImage()
                    {
                        image_index = image_index+1;
                    ");
            sb.Append("if (image_index >= "+len.ToString()+")");
            sb.Append(System.Environment.NewLine);           
            sb.Append(@"{");
            sb.Append(System.Environment.NewLine);       
            sb.Append("image_index=image_index-"+len.ToString()+";");
            sb.Append(System.Environment.NewLine);       
            sb.Append("}");
            sb.Append(System.Environment.NewLine);       
            //sb.Append(@"");
            sb.Append(@"var new_image = get_ImageItemLocation(image_list[image_index]);
                        document.all.span_1.innerText=image_index+1;
                        document.all.summary.innerText=note_list[image_index];
                        return(new_image);");
            sb.Append(System.Environment.NewLine+"}");       
           
           
            strHtml=@"
                    function rotateImage()
                    {
                        if (interval == 0)
                        {
                            return 1;
                        }
                        if (flagtime == 1)
                        {
                            var now = new Date();
                            var time1 = now.getTime();
                            var time2;
                            time1=time1+3000;
                            time2=now.getTime();
                            while(time2 < time1)
                            {
                                now = new Date();
                                time2=now.getTime();
                            }
                            flagtime=0;
                        }
                        var new_image = getNextImage();
                        document['rImage'].src = new_image;
                        var recur_call = ""rotateImage('""+'rImage'+""')"";
                        setTimeout(recur_call,interval);
                    }
                    // End -->
                    </script>
       
                    <script type=""text/javascript"" src=""Resource/Script/ygcss.js""></script>
                ";
            sb.Append(strHtml);
            strHtml=@"</HEAD><body topmargin=""0"" leftmargin=""0""><form name=""frmDispImage"">";
                   
            sb.Append(strHtml);
                strHtml=@"
                <center>
                <center>
                <table bgcolor='#fff2df' border='0' cellpadding='0' cellspacing='0' width='"
                    +ScrWidth.ToString()+@"'>
                <tbody><tr>
                <td align='center' valign='top'><table border='0' cellpadding='0' cellspacing='0' width='100%'>
                <tbody><tr>
                <td height='1'></td>
                </tr>
                </tbody></table>
                <table border='0' cellpadding='0' cellspacing='0' height='"+
                    PicHeight.ToString()+"' width='"+PicWidth.ToString()+@"' align='center'>
                <tbody><tr>
                <td align='center'><img name=""rImage"" src='"+
                   
                    ar1[0].ToString()+"' width='"+PicWidth+"' height='"+PicHeight+@"'  οnlοad=""counternum();"" border='0'></td>
                    </tr>
                    </tbody></table>
                   
                    <!--text-->
                    <table border='0' cellpadding='0' cellspacing='0' width='100%'>
                    <tbody><tr>
                    <td id=""summary"" align='center' height='"+
                    TextHeight.ToString()+"' style='font-size:"+FontSize.ToString()+"pt;'>"
                   
                    +strShopName+"-"+strBrandName+"-"+strResoourceCode+"-"+ar2[0].ToString()+@"</td>
                    </tr>
                    </tbody></table>
                    <!--/text-->
                    <!--bottom-->
                    <table border='0' cellpadding='0' cellspacing='0' width='100%'>
                    <tbody><tr>
                    <td><img src='Resource/Image/TurnImage/slideshow_bg_3.gif' border='0' height='4' width='"+ScrWidth.ToString()+@"'></td>
                    </tr>
                    <tr>
                    <td bgcolor='#c9beeb' height='"+ToolBarHeight.ToString()+@"'>
                    <table border='0' cellpadding='1' cellspacing='0' width='100%'>
                    <tbody><tr>
                    <td class='sbody' align='center' height='"+len3.ToString()+"'><font style='font-size:"+FontSize+"pt;'><span id='span_1'>1</span>/"+len.ToString()+

                            @"&nbsp;&nbsp;&nbsp;&nbsp;
                            <img src='Resource/Image/TurnImage/slideshows_bottom_1.gif' alt='开始' οnclick=""run(document.frmDispImage.select1)"" align='absmiddle' border='0' height='21' width='35'>&nbsp;&nbsp;<img src='Resource/Image/TurnImage/slideshows_bottom_2.gif' alt='停止' οnclick=""stop();"" align='absmiddle' border='0' height='21' width='35'>
                            &nbsp;&nbsp;<img src='Resource/Image/TurnImage/slideshows_bottom_3.gif' alt='前一张' οnclick=""previous();"" align='absmiddle' border='0' height='21' width='35'>&nbsp;&nbsp;<img src='Resource/Image/TurnImage/slideshows_bottom_4.gif' alt='后一张' οnclick=""next();"" align='absmiddle' border='0' height='21' width='35'>&nbsp;&nbsp;速度：
                            <select name=""select1"" οnchange=""run(this)"">
                            <option value=""12"">12 sec.</option>
                            <option selected=""selected"" value=""6"">6 sec.</option>
                            <option value=""3"">3 sec.</option>
                            <option value=""9"">9 sec.</option>
                            </select></font></td>
                            </tr>

                            </tbody></table>
                            </td>
                            </tr>
                            <tr>
                            <td bgcolor='#625a68' height='1'></td>
                            </tr>
                            </tbody></table>
                            </td>
                            </tr>
                            </tbody></table>
                            <!--/--></center>
                            <script language=""javascript"">
                                flagtime=1;
                            <!--rotateImage();-->
                            <!--slideit()-->
                                </script>

                            </center>";
                sb.Append(strHtml);
            sb.Append("</form></body></HTML>");
            return sb.ToString();   


        }

调用格式：
      
                ArrayList ar1=new ArrayList();
                ar1.Clear();
                ar1.Add("http://downmoon-hgh/RichChartServer/Top30/frmForumDisplayImage.aspx?id=160720060328095407");
                ar1.Add("http://downmoon-hgh/RichChartServer/Top30/frmForumDisplayImage.aspx?id=160420060327085709");
                ar1.Add("http://downmoon-hgh/RichChartServer/Top30/frmForumDisplayImage.aspx?id=160420060327091030");
                ar1.Add("http://downmoon-hgh/RichChartServer/Top30/frmForumDisplayImage.aspx?id=160420060327092445");
           
                drawPic(ar1);


                if(this.ar1==null || ar1.Count==0  )
                {
                   // this.MsgBox("该席位/资源无外观图！");
                   // this.CloseWebForm();
                    return ;
                }
                else
                {

                    drawPic(ar1);
                }


private void drawPic(ArrayList arrImages)
        {
            if(pic==null)
            {
                pic=new clsTurnPicture();
            }
             int i;   
            ArrayList ar2=new ArrayList();
            ar2.Clear();
            for(int k=0;k<arrImages.Count;k++)
            {    i=k+1;
                ar2.Add("展示图"+i.ToString());
            }
        Response.Write(pic.getPicsForHtml(arrImages,ar2,CurrShopName,CurBrandName,strResourceCode,1024,768,1022,640,36,34,16));
           
           
        }
JOHNCOOLS
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
原生JS以及JQuery实现信息动态播放
weixin_44427407的博客
12-27 238
原生JS以及JQuery实现信息动态播放 元旦假期赶项目，真刺激！！！ 上次国庆期间也“加班”，用BingMap画图(详情见JS画地图–BingMap)。这次比上次的麻烦一点，需要的功能也多了起来。废话不多说，直接开始，Let’s go! 1.项目需求 项目需求是每个项目开始前必须要熟知的一点，这次项目就有以下几点要求： 利用javascript在H5页面渲染地图，地图为英文版 地图上添加四个标记点，分别坐落于4个不同的位置 每个标记点对应一个提示框，提示框里会有数据展示 数据是按照时间变化的，所以再
一个自动动态播放图片的类（downmoon）新增图片效果
邀月周记
03-30 3354
第一步：创建一个类clsTurnPicture增加方法如下　：/**////         /// 播放图片类(downmoon)        ///         /// arrImgName        /// arrDesc        /// strShopName        /// strBrandName        /// strResoourceCode  
图片动态播放
梦秋音
10-25 1178
图片动态切换展示-涉及知识： - css - javascript - jQuery - html这是对之前一个文章项目的改进，使用了jQuery（一个js类库），其实不用jquery也是行的，就如同前一篇文章纯粹的js和css写的。 主要的改进是实现了图片的轮播。这里用到了DOM中window下的一个方法：setInterval(); 举个栗子，window.setInterval(“
将一组图片播放成动态图
Koffee的博客
05-11 928
在andriod里可以逐帧的播放图片，然后产生一种动态的效果
播放GIF图片的最简单方法
第三只眼的专栏
08-12 1016
1st/2nd code Code: #include ... iGifImage = CPAlbImageViewerBasic::NewL(this, TRect(TPoint(0, 0), TSize(rect.Width(),rect.Height()))); iGifImage->SetImageNameAndDisplaymodeL(aGifName ,CEikonEnv:
图片自动播放.rar
12-26
3. 时间间隔控制：为了实现自动播放，我们需要设置一个定时器（Timer组件），通过调整其Interval属性来设置每张图片的展示时间。每当定时器触发事件时，就可以切换到下一张图片。 4. 图片切换逻辑：在定时器事件...
播放动态图片
01-05
2. **UIImage Category**：可以扩展UIImage类，添加一个支持GIF的category。例如，SDWebImage库提供了这样的功能，可以方便地在UIImageView中直接加载并播放GIF。 3. **第三方库**：如FLAnimatedImage，这是一个...
浏览某个目录下所有图片按时自动播放
01-02
在IT行业中，创建一个能够自动播放目录下所有图片的应用程序是一项常见的需求，特别是在演示或幻灯片展示的场景。这个项目使用的是Visual Studio 2012和C#编程语言，这是一种广泛使用的开发环境和语言，尤其适用于...
jQuery动画焦点图 可自动播放图片2
11-17
在"jQuery动画焦点图 可自动播放图片2"这个主题中，我们将深入探讨如何利用jQuery库创建一个自动播放的图片轮播效果，以及相关的编程技术和注意事项。 首先，jQuery是一个轻量级的JavaScript库，它简化了JavaScript...
QT 自动播放gif图片
12-07
通过编译和运行这个项目，你可以看到一个带有自动播放GIF图片的窗口界面。 请注意，QT不直接支持所有GIF的所有特性，比如循环次数或帧延迟。如果需要更高级的控制，你可能需要寻找第三方库，如`libungif`或`Qt GIF`...
抖音上很火的3D立体动态相册实现代码!
热门推荐
jdk_wangtaida的博客
11-26 10万+
前言： 圣诞节快到了，是不是要给女朋友或者正在追求的妹子一点小惊喜呢，今天这篇博客就分享下前端代码如何实现3D立体动态相册。赶紧学会了，来制作属于我们程序员的浪漫吧！先上效果图，来引起下你们的兴趣。 正文： 一、新建一个index.html的文件，代码如下 <!DOCTYPE html> <html lang="en"> <head> <m...
vue 实现video动态播放本地视频
态度决定一切
12-19 1万+
案例地址：https://gitee.com/kaiking_g/vueStudy.git 案例效果图：
AVPro Video 插件在unity中动态播放视频
qq_45632382的博客
11-23 1万+
如果视频放的多，电脑或一体机配置差，就会变得卡，做起来也很麻烦，所以我今天分享一下动态播放的方法 ，占内存小，省时省力。废话不多说直接上代码 /// <summary> /// 动态播放视频 /// </summary> /// <param name="filePath">传来视频的路径</param> private void LoadVideo(string filePath) { print("
dicom 图像动态调整center with
weixin_34163553的博客
08-24 229
void CMyDicomViewerView::OnMouseMove(UINT nFlags, CPoint point){ // TODO: 在此添加消息处理程序代码和/或调用默认值 if(beginX != 0 &amp;&amp; beginY != 0) {  int xCount = point.x - beginX;  int yCount = point.y - beginY; ...
GIF动画播放教程
zjj778899的博客
02-09 1165
如果你是Mac 用户，那你应该会发现直接双击GIF动图时它会预设以「预览程式」开启，只会显示数张图片，并不会自动播放，那要怎么办呢？其实很简单，我们可以使用两个macOS 小技巧来播放GIF 图，不需要额外下载其他Mac App 喔！ 如下图，若你使用Mac 电脑，而直接双击开启Gif 档时，它预设会以「预览程序」开启，仅会显示数张连续图片，无法播放GIF 动图。 Mac 如何播放GIF 动图？ 那我们要怎么在Mac 上播放GIF 动图呢？目前有两种比较常见的方法，一个是按「空白键」来播放GIF，
CSS或JS实现gif动态图片的停止与播放
随便记记
11-13 4万+
 by zhangxinxu from http://www.zhangxinxu.com 本文地址：http://www.zhangxinxu.com/wordpress/?p=5081  一、 对于习惯性刷微博的我，总时不时会看到类似下面的游戏： 测测你和小白(白百何)有哪些共同点，戳开动图，最先看清的词是什么？ie浏览器的同学可以按esc键(或截屏)，据说在哪个词暂停，哪个词就是...
html前端自动动态切换图片，当光标移动到图片上之后图片停止切换的完整代码
最新发布
05-22
以下是一个简单的实现，通过 JavaScript 监听鼠标进入和移出事件来控制图片的切换： HTML 代码： ```html <div id="image-container"> <img src="image-1.jpg" alt="Image 1" class="active"> <img src="image-2.jpg" alt="Image 2"> <img src="image-3.jpg" alt="Image 3"> </div> ``` CSS 代码： ```css #image-container { position: relative; width: 400px; height: 300px; overflow: hidden; } #image-container img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 0.5s ease-in-out; } #image-container img.active { opacity: 1; } ``` JavaScript 代码： ```javascript var images = document.querySelectorAll('#image-container img'); var intervalId = setInterval(function() { var activeImage = document.querySelector('#image-container img.active'); var nextIndex = (parseInt(activeImage.getAttribute('src').charAt(6)) % images.length) + 1; var nextImage = document.querySelector('#image-container img:nth-child(' + nextIndex + ')'); activeImage.classList.remove('active'); nextImage.classList.add('active'); }, 2000); var imageContainer = document.querySelector('#image-container'); imageContainer.addEventListener('mouseenter', function() { clearInterval(intervalId); }); imageContainer.addEventListener('mouseleave', function() { intervalId = setInterval(function() { var activeImage = document.querySelector('#image-container img.active'); var nextIndex = (parseInt(activeImage.getAttribute('src').charAt(6)) % images.length) + 1; var nextImage = document.querySelector('#image-container img:nth-child(' + nextIndex + ')'); activeImage.classList.remove('active'); nextImage.classList.add('active'); }, 2000); }); ``` 代码解释： 1. 首先获取所有图片元素和定时器 ID。 2. 定义一个函数来轮播图片，通过获取当前活动的图片元素，计算下一张图片的索引，然后将当前图片的 `active` 类移除，将下一张图片的 `active` 类加上，实现图片的切换。将该函数赋值给定时器，以便每隔一段时间就会自动调用。 3. 获取图片容器元素，并为其添加鼠标进入和移出事件监听器。当鼠标进入时，清除定时器，停止图片的切换；当鼠标移出时，重新启动定时器，恢复图片的切换。 注意，这里的图片文件名需要按照一定的规则命名，例如 `image-1.jpg`、`image-2.jpg`、`image-3.jpg` 等，其中数字部分需要从 1 开始连续编号。这样在计算下一张图片的索引时才能正确地循环播放。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值