I have to implement animation for images similiar to shown in bellow link
http://ajax.asp.net/showcase/default.aspx?tabid=47
Why don't you look into the PopupExtender control?
Hi Trebolin. I also would like to achieve the effect citeabove. I followed your advice and was able to get close with thePopupExtender using this code:
<asp:Image ID="Image1" runat="server" Height="135px" ImageUrl="~/Images/ad1.jpg" Style="cursor:pointer" Width="218px"/>
<asp:Panel ID="Panel1" runat="server" CssClass=".popupControl" Height="300px" Width="500px" BackColor="#FFFFC0">
</asp:Panel>
<cc1:PopupControlExtender ID="PopupControlExtender1" runat="server"TargetControlID="Image1" PopupControlID="Panel1" OffsetX="10"OffsetY="10" Position="Bottom">
</cc1:PopupControlExtender>
But I have to click the imageto get the panel to popup. How can I get the panel to popup onmouseover or hover like in the example cited above? Thanks forany feedback you can provide.
Actually, the HoverMenuExtender is a better choice for my specific need. These Ajax controls are fantastic.
Hi,
Please try this:
<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"Hope this helps.
<script runat="server"
</script
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager
</div
<asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px" BackColor="#FFFFC0">
This is the popup control</asp:Panel>
<asp:Button ID="Button1" runat="server" Text="Button" />
<ajaxToolkit:PopupControlExtender ID="PopupControlExtender1"BehaviorID="pop"runat="server" PopupControlID="Panel1" TargetControlID="Button1">
</ajaxToolkit:PopupControlExtender>
</form
<script type="text/javascript">
function pageLoad(sender, args)
{
// $get("Button1").style.visibility = "hidden";
$get("Panel1").onmouseout = mouseOut;
}function mouseOut()
{
var bh = $find("pop");
bh.hidePopup();
}
</script
</body>
</html>
No comments:
Post a Comment