asp.net+javascript滚动新闻（详细实现）by C#

最新推荐文章于 2017-04-20 22:29:42 发布

暴烈骑士

最新推荐文章于 2017-04-20 22:29:42 发布

阅读量936

点赞数

分类专栏： web 文章标签： JavaScript ASP.NET 新闻滚动新闻跑马灯

本文链接：https://blog.csdn.net/u010543785/article/details/10197379

版权

web 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

先在解决方案的web下里新建一个web用户控件
web自定义控件ascx文件前台：
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="newsPictureRun.ascx.cs" Inherits="Audit.Web.control.newsPictureRun" %>
<link href="../Css/index.css" rel="stylesheet" type="text/css" />

<div id="marquee_demo" style="overflow: hidden; width: 100%; text-align: center;
border: 1px solid #ffffff">
<table cellspacing="0" cellpadding="3" align="center" border="0">
<tr>
<td id="marquee_product1" valign="top">
<table width="100%" height="100px" border="0" cellpadding="1" cellspacing="0">
<tr>
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<td>
<a href="/Content.aspx?id=<%# Eval("newsId")%>" target="_blank">
 <img src='<%#Eval("newsPictureAddress")%>' border="0"/><br/><%#Eval("newsTitleName")%></a>
</td>
</ItemTemplate>
</asp:Repeater>
</tr>
</table>
</td>
<td id="marquee_product2" valign="top">
</td>
</tr>
</table>
</div>

<script type="text/javascript">
var speed = 30;
marquee_product2.innerHTML = marquee_product1.innerHTML;
function Marquee() {
if (marquee_demo.scrollLeft >= marquee_product1.scrollWidth) {
marquee_demo.scrollLeft = 0;
}
else {
marquee_demo.scrollLeft++;
}
}
var MyMar = setInterval(Marquee, speed);
marquee_demo.onmouseover = function () { clearInterval(MyMar); }
marquee_demo.onmouseout = function () { MyMar = setInterval(Marquee, speed); }
</script>
cs文件后台：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

namespace Audit.Web.UserControl
{
public partial class newsPictureRun : System.Web.UI.UserControl
{
public DataSet ds = new DataSet();
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
BindData();
}
}
private void BindData()
{
//SqlConnection con = new SqlConnection("Data Source=192.168.2.71;Initial Catalog=10nchu_HouseFunds;User ID=sa;Password=Pass@word;User Instance=False");
//SqlCommand cmd = new SqlCommand();
//cmd.CommandText = "select * from tb_news where c_newsType=3";
//cmd.Connection = con;
//cmd.CommandType = CommandType.Text;
//SqlDataAdapter sda = new SqlDataAdapter(cmd);
//sda.Fill(ds);

Audit.Bll.NewsService bll = new Audit.Bll.NewsService();
ds = bll.GetList("newsCategoryId = 21");
this.Repeater1.DataSource = ds;
this.Repeater1.DataBind();
//this.tt1.Value = "nihao";
}
}
}

将控件名为newsPictureRun的控件在aspx文件<head>里引入：
<%@ Register Src="~/UserControl/.ascx" TagName="ucam" TagPrefix="newsPictureRun" %>
在aspx中的某个要展示滚动新闻的div里运用控件：
<div id = "right1left" >
<newsPictureRun:ucam ID="ucam1" runat="server" />
</div>
到此功能就实现了