动态修改的图片滚动效果(asp.net版本)

最新推荐文章于 2016-06-30 22:39:59 发布

happyhcs

最新推荐文章于 2016-06-30 22:39:59 发布

阅读量2.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： ASP.NET 文章标签： asp.net string null sql object image

本文链接：https://blog.youkuaiyun.com/happyhcs/article/details/1779691

ASP.NET 专栏收录该内容

8 篇文章

订阅专栏

本文介绍如何使用CSS和DIV实现类似优快云首页的变化广告效果，无需依赖Flash。通过引入特定JS文件并结合.NET后台代码，实现图片滚动显示，并自定义图片尺寸。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我讲的这个是通过css+div实现的，不是通常的用flash实现的，类似优快云首页的变化广告效果。

声明我参考了校服男生的文章。

先看一下效果图(如http://jkx.suse.edu.cn/new右下角图片滚动效果)，实现很简单，请大家仔细看看如下介绍：

首先建立一个页面test.aspx需要包含如下几个JS文件：

（文章末将提供下载）

前台页面中除了引用上诉文件外，再简单的通过一个变量<%=str %>显示内容（前台如何显示大家可以随意处理，这里只为说明效果），然后我们需要好好处理我们的后台代码了。

test.aspx.cs部分代码如下：（会.net和JS的朋友对如下代码应该很清楚，我就不再一一介绍）

protected static int Repeat1__numRows = 10 ;

protected static int Repeat1__index = 0 ;

protected static int rs_numRows = rs_numRows + Repeat1__numRows;

protected static int i = 1 ;

protected static string str = null ; // 用户存放返回给前台的数据

protected void Page_Load( object sender, EventArgs e)

{

if (!this.IsPostBack)

{

str="<SCRIPT type=text/javascript>var data = {};";

string strdata=null;

OleDbConnection conn = DB.index_createCon();//自己定义的数据库连接方法，这里大家自行处理

string sql = "select * from [FriendLink] where LinkType='图片连接'";

OleDbCommand cmd = new OleDbCommand(sql,conn);

conn.Open();

OleDbDataReader odr = cmd.ExecuteReader();

while (odr.Read())

{

strdata = "img:" + odr["picurl"].ToString() + ";url:" + odr["LinkUrl"].ToString() + ";target:_blank;alt:;";

str=str+"data['-1_"+i+"']='"+strdata.ToString()+"';";

Repeat1__index=Repeat1__index+1;

Repeat1__numRows=Repeat1__numRows-1;

i=i+1;

}

str=str+"var ri = new MzRotateImage();ri.dataSource =data;";

str = str + "ri.width = 350;ri.height =160;ri.interval = 3000;ri.duration = 2000;document.write(ri.render());</SCRIPT>";

}

我在做的过程中没法实现图片的大小改变，我最后的解决办法是，用c#的Image类，根据原图复制一个给定的大小的图片，然后同时存储大小两张图片。

如果有人解决这个问题，请与我分享阿！

http://dl2.youkuaiyun.com/down4/20070910/10200335463.rar