这几天一直在愁着网页的一个效果，图片翻转。按照原来的想法，需要在鼠标移到图片上时，图片发生变化，鼠标点击时，图片再次发生变化，而且文本内容也发生变化。这用javascript很好实现，不过更新文本的时候需要从数据库动态调用内容，这就有些难了。我一方面想纯粹用JavaScript把这个问题解决，另一方面又想纯粹用ASP.NET把这个问题解决，结果发现总是有那么些缺陷，不能把它们完美地解决掉。今天早上，看了微软的MSDN，没想到这个问题就迎刃而解了。不过这个办法是针对ASP.NET 2.0的，不知道对于1.0的合不合适，今天晚上回去验证一下。
1
<%@ Page Language="C#" %>
2<script runat="server">
3protected void Page_Load(object sender, EventArgs e)
4
{
5
Page.RegisterClientScriptBlock("MyScript", _
6 "if (document.images) {" +
7 "MyButton = new Image;" +
8 "MyButtonShaded = new Image;" +
9 "MyButton.src = 'button1.gif;" +
10 "MyButtonShaded.src = 'button2.gif;" +
11 "}" +
12 "else {" +
13 "MyButton = '';" +
14 "MyButtonShaded = '';" +
15 "}", true);
16
17 ImageButton1.Attributes.Add("onmouseover",
18 "this.src = MyButtonShaded.src;" +
19 "window.status='是的！请单击此处！';");
20 ImageButton1.Attributes.Add("onmouseout",
21 "this.src = MyButton.src;" +
22 "window.status='';");
23
}
24
25 protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
26 {
27 Label1.Text = "回发！";
28 }
29</script>
30
31<html xmlns="http://www.w3.org/1999/xhtml" >
32<head runat="server">
33 <title>使用 JavaScript</title>
34</head>
35<body>
36 <form id="form1" runat="server">
37 <div>
38 <p>
39 <asp:ImageButton id="ImageButton1"
40 onmouseover="this.src='button2.gif'"
41 onclick="ImageButton1_Click"
42 onmouseout="this.src='button1.gif'" runat="server"
43 ImageUrl="button1.gif"></asp:ImageButton>
44 </p>
45 <p>
46 <asp:Label id="Label1" runat="server" />
47 </p>
48 </div>
49 </form>
50</body>
51</html>
52
53
<%@ Page Language="C#" %>2
<script runat="server"> 3
protected void Page_Load(object sender, EventArgs e)4
{
5
Page.RegisterClientScriptBlock("MyScript", _6
"if (document.images) {" +7
"MyButton = new Image;" +8
"MyButtonShaded = new Image;" +9
"MyButton.src = 'button1.gif;" +10
"MyButtonShaded.src = 'button2.gif;" +11
"}" +12
"else {" +13
"MyButton = '';" +14
"MyButtonShaded = '';" +15
"}", true);16
17
ImageButton1.Attributes.Add("onmouseover",18
"this.src = MyButtonShaded.src;" +19
"window.status='是的！请单击此处！';");20
ImageButton1.Attributes.Add("onmouseout",21
"this.src = MyButton.src;" +22
"window.status='';");23
}24
25
protected void ImageButton1_Click(object sender, ImageClickEventArgs e)26
{27
Label1.Text = "回发！";28
}29
</script>30
31
<html xmlns="http://www.w3.org/1999/xhtml" >32
<head runat="server">33
<title>使用 JavaScript</title>34
</head>35
<body>36
<form id="form1" runat="server">37
<div>38
<p>39
<asp:ImageButton id="ImageButton1" 40
onmouseover="this.src='button2.gif'" 41
onclick="ImageButton1_Click" 42
onmouseout="this.src='button1.gif'" runat="server" 43
ImageUrl="button1.gif"></asp:ImageButton>44
</p>45
<p>46
<asp:Label id="Label1" runat="server" />47
</p>48
</div>49
</form>50
</body>51
</html>52
53
浙公网安备 33010602011771号