Hi ,
to use the MOVE animation, the element has to be ABSOLUTELY positioned.
Add the style attribute .. style="position:absolute" and then try moving the Panel.
Set the AnimationTarget to be "Panel1", otherwise the Button1 will move .
new Markup ..
<asp:PanelID="Panel1"runat="server"Height="50px"Width="125px" style="position:absolute">
<asp:LabelID="Label1"runat="server"Text="This is a test."></asp:Label>
</asp:Panel>
<ajaxToolkit:AnimationExtenderID="AnimationExtender1"runat="server"TargetControlID="Button1">
<Animations>
''<OnClick>
<MoveRelative="False"Horizontal="500"Duration=".5"Fps="20" AnimationTarget="Panel1"/>
</OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>
Please mark my reply as the answer if This resolves it.
That worked! Thanks for the help.
I tried marking your reply as the answer, but I keep getting a javascript error.
Thanks,
Sean
lol ,
Try again later , probably some maintenance or network Traffic issue
Finally got it to mark your reply as the answer - not sure what the issue was.
I do have a follow up issue with regards to wiring the animation up to the button click event. When I do this, the behavior is very strange. The animation only lasts for a brief second, does not move more than 100 or so pixels to the right, and the movement is not smooth at all. When I change this to wire the animation up to the Panel click event, it works perfectly. Any idea why? Eventually, I want to hook this up to a timer or similar mechanism to create a slide show (any help you an give in that area would be apprecited as well).
Thanks again for your help.
Sean
<ajaxToolkit:AnimationExtenderID="AnimationExtender1"runat="server"TargetControlID="Button1"><Animations>
</OnClick><OnClick>
<movehorizontal="800"Fps="30"duration="3"animationtarget="Panel1"/>
</Animations></ajaxToolkit:AnimationExtender>
"The animation only lasts for a brief second, does not move more than 100 or so pixels to the right, and the movement is not smooth at all."
Sounds weird , can you please share the markup for the same ?
"Eventually, I want to hook this up to a timer or similar mechanism to create a slide show "
For this , you can use the Sys.Timer control .
check out the documentation here -->http://ajax.asp.net/docs/overview/UsingTimerControlTutorial.aspx.
If there is a question the Docs leave unanswered , please let me know , I will try my best to answer
The markup is the same as my original post, with the exception of the position:absolute sytle attribute added per your suggestion. Once I added it, the panel moved, but in the strange manner I have described in my previous post. If I leave everythign else the same, and change the targetcontrolid in the animationextender line from this:
<ajaxToolkit:AnimationExtenderID="AnimationExtender1"runat="server"TargetControlID="Button1">
to this:
<ajaxToolkit:AnimationExtenderID="AnimationExtender1"runat="server"TargetControlID="Panel1"> the animation works great. If it gets hooked up to the button1 click event, it seems to behave as if the page is re-loading during the animation (or something similar) and the visual experience is very choppy.I agree, the experience is very bad when the button1 is assigned to be the TargetControl .
And thats because the Button1 is rendered to be a Submit button and posts the page when clicked.
Try this , use the following button as the trigger for your animation
<
inputtype="button"runat="server"id="btnOne"value="start Animation"/><ajaxToolkit:AnimationExtenderID="AnimationExtender1"runat="server"TargetControlID="btnOne">
Hope this helps
Hi,
You could also addOnClientClick="return false;" to your button to prevent it from starting a postback when clicked.
Thanks,
Ted
No comments:
Post a Comment