How to call Getslides method for ajax slideshow extender on demand( cu

Hi

I have reg Ajax slideshow extender doubt

I am trying to implement facebook style image slideshow on image click

Here I am using mutiple modalpopup and ajax slideshow extender on every modal popup

1) Please suggest me using mutiple modalpopup and ajax slideshow extender is best solution or I should modify the code.

And using mutiple modalpopup extender and slideshow extnder will affect web application performance?

2)On every page load GetSlides method is executing. i want to stop executing on every page load and should execute on demand

when particuler slideshow is going to popup only that servise method should be executted not others

Your Help will be apritiated, Look forrward for your help and support


<script runat="Server" type="text/C#">


[System.Web.Services.WebMethod]
[System.Web.Script.Services.ScriptMethod]
public static AjaxControlToolkit.Slide[] GetSlides()
{
return new AjaxControlToolkit.Slide[] {
new AjaxControlToolkit.Slide
("Images/Blue hills.jpg", "Blue Hills", "Go Blue"),
new AjaxControlToolkit.Slide("Image/1.jpg", "Sunset", "Setting sun"),
new AjaxControlToolkit.Slide("Image/2.jpg", "Winter", "Wintery..."),
new AjaxControlToolkit.Slide
("Image/3.jpg", "Water lillies", "Lillies in the water"),
new AjaxControlToolkit.Slide
("Image/4.jpg", "Sedona", "Portrait style picture")};
}

</script>

<script type="text/javascript">
function ShowSlider()
{
debugger
var panel =$find('mpslideshow1');


panel.show();


}

<input id="Image1" type="image" runat="server" src="~/Image/Sunset.jpg" onclick='javascript:ShowSlider();'
onmouseover="this.src='Image/Blue hills.jpg'" onmouseout="this.src='Image/Sunset.jpg'"
style="height: 100px; width: 100px" />

<div>
<asp:Panel runat="server" ID="pnlslideshow" BackColor="White" Height="400px" Width="400px"
Style="border: solid 2px red;">
<asp:Image ID="imagefhfd" runat="server" ImageUrl="~/Image/Blue hills.jpg" />
<asp:SlideShowExtender ID="SlideShowExtender1" runat="server" TargetControlID="imagefhfd"
SlideShowServiceMethod="GetSlides" AutoPlay="true" Loop="true" >
</asp:SlideShowExtender>
</asp:Panel>
<input type="button" runat="server" id="prevButton" style="display: none" />
<input type="button" runat="server" id="playButton" style="display: none" />
</div>
<input type="button" runat="server" id="dummybuton" style="display: none" visible="true" />
<asp:ModalPopupExtender runat="server" ID="mpslideshow1" BackgroundCssClass="modalBackground"
BehaviorID="mpslideshow1" TargetControlID="Image1" PopupControlID="pnlslideshow">
</asp:ModalPopupExtender>
In above code I have one image for that image one slideshow and modalpopup.

Like this I have 8 diff images and for every image one album, so I am going to use separte modalpopup, slideshow extender, javascript function, servicemthod for slideshowextender.

Thank you in advance