0

我试图在页面加载时淡出图像。我是 Jquery 的新手,但我需要一些帮助,因为我没有在 google 中找到有效的答案,我错过了什么

WebForm1.aspx

@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Zzz.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <script type="text/javascript" id="fadeout">
         $(body).ready(function () {
             $('#Image1').fadeOut(3000);
         });

     </script>

</head>
<body onload="fadeout">
    <form id="form1" runat="server">

        <asp:Image ID="Image1" runat="server" Style =" position:absolute;width:100px;height:100px;left:10px;top:10px; " ImageUrl="~/Photos/facebook.jpg"  />

    </form>
</body>
</html>

WebForm1.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Zzz
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }
    }
}
4

3 回答 3

1
  1. 您没有引用 jquery 库。
  2. 使用$(document).ready(function() {...})$(function() {...})
于 2013-11-05T21:16:07.153 回答
0

尝试这个:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>    
     $(document).ready(function () {
         $('#Image1').fadeOut(3000);
     });
</script>

要从您的 .cs 代码执行:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Zzz
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Page.ClientScript.RegisterStartupScript(this.GetType(), "", "$('#Image1').fadeOut(3000);", true);
        }
    }
}
于 2013-11-05T21:15:30.850 回答
0

您需要在头部或页面中包含 jQuery 库,将其放入(我使用 CDN,但您可以在本地获取):

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

您需要使用正确的页面加载语句,最重要的是,使用正确的语句来识别元素(ASP.NET 将文本添加到 ASP 元素 ID,因此您需要从框架中获取该 id):

$(function () {
    $('#<%=Image1.ClientID%>').fadeOut(3000);
});

最后,如果可以的话,建议您使用 ASP.NET MVC 开始您的项目

于 2013-11-05T21:35:09.277 回答