JavaScript Image or Text Slider in ASP.Net

In below code section,  3 java script to slide image and TEXT in 3 different section.

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">

    <%-------------------------------------Leading Portion------------------------%>

    <script language="javascript1.1" type="text/javascript">

        //-----------------------------------Leading Portion variable------------------

        var ImageList;

        var variableslide = new Array()

        var variableslide_ = new Array()

        var Winnercurrentslide = 0

        var currentslide = 0

        //-------------------------------------------End Variable------------

        //====================================Common Portion-========================================

        // variable slide

        var slidewidth = '257px'

        var slideheight = '170px'

        var slidebgcolor = '#fffbe5'

        var slidedelays = 3000

        ////Do not edit pass this line////////////////

        var ies = document.all

        var doms = document.getElementById

        //====================================Common Portion-========================================

        //-------------------------------------Leading Portion--------------------------------------  ManOfTheMatch

        //var domain = '<%="http://" + Request.ServerVariables["HTTP_HOST"].ToString() + Request.ApplicationPath %>'

        slidewidthMOM = '246px';

        slideheightMOM = '176px';

        function arrayInit() {

            var ImageList = document.getElementById("<%= hdLastWeekManOfTheMatch.ClientID  %>").value;

            var Round = document.getElementById("<%= hdRound.ClientID  %>").value;

            var imgstr = ImageList.replace(/,/gi, '');

           if (imgstr == '') {

                ImageList = 'Default,';

            }

            var variableslide_ = ImageList.split(',');

            var ArrayRound = new Array()

            ArrayRound = Round.split(',')

            var i = 0;

            for (i; i < variableslide_.length; i++) {

                variableslide[i] = ['/Images/ManOfTheMatch/' + variableslide_[i].toLowerCase() + '.png~' + ArrayRound[i], '', '']

            }

            for (i = 0; i < variableslide.length; i++) {

                var cacheimages = new Image()

                cacheimages.src = variableslide[i][0]

            }

            start_slider();

        }

        //-------------------------------------Leading Portion-------------------------------------- 

      

        //-------------------------------------Leading Portion-------------------------------------- 

        function FileExists(strURL)

{

oHttp = window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();

oHttp.open("GET", strURL, false);

oHttp.send();

return (oHttp.status == 404) ? false : true;

}

       

        var tmp = new Image;

        function rotateimages() {

            span_MOMLastWeek = document.getElementById("<%= span_MOMLastWeek.ClientID  %>");

            var imgeAndRound = new Array()

            imgeAndRound = variableslide[currentslide][0].split('~')

            contentcontainer = '<center>'

            if (variableslide[currentslide][1] != "")

                contentcontainer += '<a href="' + variableslide[currentslide][1] + '">'

            if (FileExists(imgeAndRound[0]))

                { contentcontainer += '<img src="' + imgeAndRound[0] + '" border="0" vspace="3"  style="vertical-align:middle;">'

                }

                else

                {contentcontainer += '<img src="Images/ManOfTheMatch/Default.png" border="0" vspace="3"  width="140" height="87" style="vertical-align:middle;">'

                }

//            tmp.src = imgeAndRound[0];

//            if (tmp.complete)

//               {

//            contentcontainer += '<img src="' + imgeAndRound[0] + '" border="0" vspace="3"  style="vertical-align:middle;">'

//            }

//            else{

//                contentcontainer += '<img src="Images/ManOfTheMatch/Default.png" border="0" vspace="3"  width="140" height="87" style="vertical-align:middle;">'

//            }

           

            if (variableslide[currentslide][1] != "")

                contentcontainer += '</a>'

            contentcontainer += '</center>'

            if (variableslide[currentslide][2] != "")

                contentcontainer += variableslide[currentslide][2]

            if (document.layers) {

                crossrotateobjs.document.write(contentcontainer)

                crossrotateobjs.document.close()

            }

            else if (ies || doms) {

                crossrotateobjs.innerHTML = contentcontainer

                span_MOMLastWeek.innerHTML ="("+ imgeAndRound[1]+")"

            }

               if (currentslide == variableslide.length - 1) currentslide = 0

            else currentslide++

            setTimeout("rotateimages()", slidedelays)

        }

        function start_slider() {

            crossrotateobjs = doms ? document.getElementById("slideManOfTheMatch") : ies ? document.all.slidedom : document.slidensmain.document.slidenssub

            if (document.layers)

                document.slidensmain.visibility = "show"

            rotateimages();

        }

        if (ies || doms)

            start_slider()

        else if (document.layers)

            window.onload = start_slider

        // ------------------------------------End Leading Portion

    </script>

  <%-------------------------------------Current Match Leading Portion--------------------------------------%>

    <script language="javascript1.5" type="text/javascript">

        //-------------------------------------Current Match  Leading Portion--------------------------------------  ManOfTheMatch

        var ImageListLT;

        var variableslideLT = new Array()

        var variableslideLT_ = new Array()

        var currentslideLT = 0

        var slidedelaysLT = 3200

        slidewidthMOM = '246px';

        slideheightMOM = '176px';

        function ManOfTheMatchLT() {

            var ImageListLT = document.getElementById("<%= hdLeadingTeamManOfTheMatch.ClientID  %>").value;

            var Imgstr = ImageListLT.replace(/,/gi, '');

            if (Imgstr == '') {

                ImageListLT = 'Default,';

            }

            var variableslideLT_ = ImageListLT.split(',');

            var i = 0;

            for (i; i < variableslideLT_.length; i++) {

               // variableslideLT[i] = ['Images/ManOfTheMatch/' + variableslideLT_[i].toLowerCase() + '.png', '', '']

                variableslideLT[i] = [ variableslideLT_[i] , '', '']

            }

            for (i = 0; i < variableslideLT.length; i++) {

                var cacheimagesLT = new Image()

                cacheimagesLT.src = variableslideLT[i][0]

            }

            start_sliderLT();

        }

        //-------------------------------------Current Match  Leading Portion-------------------------------------- 

        //-------------------------------------Current Match  Leading Portion-------------------------------------- 

        function rotateimagesLT() {

//            contentcontainer = '<center>'

//            if (variableslide[currentslide][1] != "")

//                contentcontainer += '<a href="' + variableslideLT[currentslideLT][1] + '">'

//            contentcontainer += '<img src="' + variableslideLT[currentslideLT][0] + '" border="0" vspace="3" width="230" height="135"  style="vertical-align:middle;">'

//            if (variableslide[currentslideLT][1] != "")

//                contentcontainer += '</a>'

            //            contentcontainer += '</center>'

            contentcontainer = ''

            contentcontainer += variableslideLT[currentslideLT][0]

            if (variableslideLT[currentslideLT][2] != "")

                contentcontainer += variableslideLT[currentslideLT][2]

            if (document.layers) {

                crossrotateobjsLT.document.write(contentcontainer)

                crossrotateobjsLT.document.close()

            }

            else if (ies || doms)

                crossrotateobjsLT.innerHTML = contentcontainer

            if (currentslideLT == variableslideLT.length - 1) currentslideLT = 0

            else currentslideLT++

            setTimeout("rotateimagesLT()", slidedelaysLT)

        }

        function start_sliderLT() {

            crossrotateobjsLT = doms ? document.getElementById("slideManOfTheMatchLT") : ies ? document.all.slidedom : document.slidensmain.document.slidenssub

            if (document.layers)

                document.slidensmain.visibility = "show"

            rotateimagesLT();

        }

        if (ies || doms)

            start_sliderLT()

        else if (document.layers)

            window.onload = start_sliderLT

        // ------------------------------------End Current Match  Leading Portion ------------------------------------------------------------

    </script>

    <%-------------------------------------Winning Portion---------------%>

    <script language="javascript" type="text/javascript">

 <!--

        //-----------------------------------Winning Portion variable------------------

        var increment = 0

        var List;

        var Winnervariableslide = new Array()

        var Winnervariableslide_ = new Array()

        //-------------------------------------------End Variable------------

        //====================================Common Portion-========================================

        variableslide

        var slidewidth = '257px'

        var slideheight = '170px'

        var slidebgcolor = '#fffbe5'

        var slidedelayWin = 2900

        ////Do not edit pass this line////////////////

        var ie = document.all

        var dom = document.getElementById

        //====================================Common Portion-========================================

        //-------------------------------------Winning Portion-------------------------------------- 

        function WinnerArrayInit() {

            var WinnerImageList = document.getElementById("<%= hdWinningList.ClientID  %>").value;

            var Winnervariableslide_ = WinnerImageList.split(',');

            var i = 0;

            for (i; i < Winnervariableslide_.length; i++) {

                Winnervariableslide[i] = ['TeamLogo/' + Winnervariableslide_[i].toLowerCase() + '.png', '', '']

            }

            for (i = 0; i < Winnervariableslide.length; i++) {

                var cacheimage = new Image()

                cacheimage.src = Winnervariableslide[i][0]

            }

            start_slider_ForWinner();

        }

        //-------------------------------------Winning Portion-------------------------------------- 

        //-----------------------------------Winning Portion-------------------------------------- 

        function WinnerRotateimages() {

            //-----------------------------------Winning Portion Result Bind-------------------------------------- 

            Winnercontentcontainer = '<center>'

            if (Winnervariableslide[Winnercurrentslide][1] != "")

                Winnercontentcontainer += '<a href="' + Winnervariableslide[Winnercurrentslide][1] + '">'

            Winnercontentcontainer += '<img src="' + Winnervariableslide[Winnercurrentslide][0] + '" border="0" vspace="3" style="vertical-align:middle;" >'

            if (Winnervariableslide[Winnercurrentslide][1] != "")

                Winnercontentcontainer += '</a>'

            Winnercontentcontainer += '</center>'

            if (Winnervariableslide[Winnercurrentslide][2] != "")

                Winnercontentcontainer += Winnervariableslide[Winnercurrentslide][2]

            if (document.layers) {

                crossrotateobjWinner.document.write(Winnercontentcontainer)

                crossrotateobjWinner.document.close()

            }

            else if (ie || dom)

                crossrotateobjWinner.innerHTML = Winnercontentcontainer

            //-----------------------------------End Winning Portion Result Bind--------------------------------------

            if (Winnercurrentslide == Winnervariableslide.length - 1) Winnercurrentslide = 0

            else Winnercurrentslide++

            if (increment == 0) {

                increment++

                LeadingImageSlider()

                arrayInit()

                ManOfTheMatchLT()

            } setTimeout("WinnerRotateimages();", slidedelayWin)

        }

        function start_slider_ForWinner() {

            crossrotateobjWinner = dom ? document.getElementById("slideWinner") : ie ? document.all.slidedom : document.slidensmainWinner.document.slidenssubWinner

            if (document.layers) {

                document.slidensmainWinner.visibility = "show"

            }

            WinnerRotateimages()

        }

        if (ie || dom)

            start_slider_ForWinner()

        else if (document.layers)

            window.onload = start_slider_ForWinner

//-->

    </script>

    <%-------------------------------------Current Match Winning Portion variable---------------%>

    <script language="javascript1.3" type="text/javascript">

        var slidespeed = 3100

        var pixeldelay = (ie55) ? document.images.slide.filters[0].duration * 1000 : 0

        var whichlink = 0

        var whichimage = 0

        var LadingImageList

        var LadingImageLinkList

        var slideimages = new Array()

        var slidelinks = new Array()

        var imageholder = new Array()

        var ie55 = window.createPopup

        var slideimages_ = new Array()

        var slidelinks_ = new Array()

        function LeadingImageSlider() {

            LadingImageList = document.getElementById("<%= hdLeadingList.ClientID  %>").value;

            LadingImageLinkList = document.getElementById("<%= hdLeadingListLink.ClientID  %>").value;

            slideimages_ = LadingImageList.split(',');

            slidelinks_ = LadingImageList.split(',');

            var i = 0;

            // var slideimages = new Array("images/aganti.png", "images/ashoka.png", "images/dp.png")

            // var slidelinks = new Array("http://www.dynamicdrive.com", "http://wsabstract.com", "http://www.geocities.com")

            // slideimages = new Array(LadingImageList)

            //slidelinks = new Array(LadingImageList)

            for (i; i < slideimages_.length; i++) {

                slideimages[i] = ['TeamLogo/' + slideimages_[i].toLowerCase() + '.png', '', '']

                imageholder[i] = new Image()

                imageholder[i].src = slideimages[i][0]

            }

            slideit()

        }

        function slideit() {

            if (!document.images) return

            if (ie55) document.images.slide.filters[0].apply()

            document.images.slide.src = imageholder[whichimage].src

            if (ie55) document.images.slide.filters[0].play()

            whichlink = whichimage

            whichimage = (whichimage < slideimages.length - 1) ? whichimage + 1 : 0

            setTimeout("slideit();", slidespeed + pixeldelay)

        }

        function gotoshow() {

            window.location = slidelinks[whichlink]

        }

         

         

          

    </script>

   <body>

    <div class="wrapSubpage">

      <table width="980" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="700">

   

    </td>

    <td width="260"><table width="260" border="0" cellspacing="0" cellpadding="0" class="rgt_boder">

    <tr>

        <td height="7"></td>

      </tr>

  <tr>

    <td><table width="260" border="0" cellspacing="0" cellpadding="0" class="box_rt3">

      <tr>

        <td><table width="240" border="0" cellspacing="0" cellpadding="0" align="center">

          <tr>

            <td height="44" class="rgt_box_tx">Leading Team </td>

          </tr>

          <tr>

            <td align="center" valign="top">

            <%--<div style="padding-bottom: 10px; width: 257px; height: 170px; background-color: #fffbe5;

                                                text-align: center; vertical-align: middle">--%>

                                                <a>

                                                    <%--href="javascript:gotoshow()"--%>

                                                    <img src="photo1.jpg" name="slide" border="0" style="padding-top: 2px; filter: progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=15,Duration=1)">

                                                </a>

                                          <%--  </div>--%>

            </td>

          </tr>

         <%-- <tr>

            <td>&nbsp;</td>

          </tr>--%>

        </table></td>

      </tr>

    </table></td>

  </tr>

  <tr>

    <td height="3"></td>

  </tr>

  <tr>

    <td>

    <table width="260" border="0" cellspacing="0" cellpadding="0" class="box_rt3">

      <tr>

        <td><table width="240" border="0" cellspacing="0" cellpadding="0" align="center">

          <tr>

            <td height="44" class="rgt_box_tx">Man Of The Match <span class="teamName2tx">(Leading Team)</span> </td>

          </tr>

          <tr>

            <td style="padding-top:10px;">

            <script language="javascript1.3">

     

                                            if (ie || dom)

                                                document.write('<div id="slideManOfTheMatchLT" style="vertical-align:middle;"></div>')

//                                                  document.write('<div id="slideManOfTheMatchLT" style="width:' + slidewidthMOM + ';height:' + slideheightMOM + '; background-color:' + slidebgcolor + ';vertical-align:middle;padding-top:10px;"></div>')

                                          

                                                    </script>

            </td>

          </tr>

          <%--<tr>

            <td>&nbsp;</td>

          </tr>--%>

        </table></td>

      </tr>

    </table></td>

  </tr>

   <tr>

    <td height="3"></td>

  </tr>

  <tr>

    <td><table width="260" border="0" cellspacing="0" cellpadding="0" class="box_rt3">

      <tr>

        <td><table width="240" border="0" cellspacing="0" cellpadding="0" align="center">

          <tr>

            <td height="44" class="rgt_box_tx">Winner<span class="teamName2tx">(Last Week)</span> </td>

          </tr>

          <tr>

            <td>

            <script language="javascript1.2">

     

                                            if (ie || dom)

                                                document.write('<div id="slideWinner" style="vertical-align:top;padding-top:2px;"></div>')

                                               

                                           

                                                    </script>

                                                   <%-- background-color:' + slidebgcolor + ';--%>

            </td>

          </tr>

         <%-- <tr>

            <td>&nbsp;</td>

          </tr>--%>

        </table></td>

      </tr>

    </table></td>

  </tr>

  <tr>

    <td height="3"></td>

  </tr>

  <tr>

    <td><table width="260" border="0" cellspacing="0" cellpadding="0" class="box_rt3">

      <tr>

        <td><table width="240" border="0" cellspacing="0" cellpadding="0" align="center">

          <tr>

            <td height="44" class="rgt_box_tx">Man Of The Match<span id="span_MOMLastWeek" class="teamName2tx" runat="server"></span></td><%--(Last Week)--%>

          </tr>

          <tr>

            <td> <script language="javascript1.3">

            if (ie || dom)

                                                document.write('<div id="slideManOfTheMatch" style="vertical-align:top;padding-top:2px;"></div>')

                                                //background-color:' + slidebgcolor + ';

                 </script>

                                           </td>

          </tr>

          <%--<tr>

            <td>&nbsp;</td>

          </tr>--%>

        </table></td>

      </tr>

    </table></td>

  </tr>

</table>

</td>

  </tr>

</table>

  <asp:HiddenField ID="hdWinningList" runat="server"></asp:HiddenField>

                                <asp:HiddenField ID="hdLeadingList" runat="server"></asp:HiddenField>

                                <asp:HiddenField ID="hdLeadingListLink" runat="server"></asp:HiddenField>

                                <asp:HiddenField ID="hdLeadingTeamManOfTheMatch" runat="server"></asp:HiddenField>

                                 <asp:HiddenField ID="hdLastWeekManOfTheMatch" runat="server"></asp:HiddenField>

                                 <asp:HiddenField ID="hdRound" runat="server"></asp:HiddenField>

    </div>

    </body>

</asp:Content>

C# code to inatialize and call javascript to start javascript execution

protected void Page_Load(object sender, EventArgs e)

    {

#region " Man Of The Match "

                if (ds.Tables[1].Rows.Count > 0)

                {

                    for (int i = 0; i < ds.Tables[1].Rows.Count; i++)

                    {

                        lastWeekManOfTheMatch = lastWeekManOfTheMatch + Convert.ToString(ds.Tables[1].Rows[i]["ManOfTheMatch_Code"]) + ",";//

                        round = round + Convert.ToString(ds.Tables[1].Rows[i]["Round"]).Trim() + ",";

                    }

                }

                #endregion

                imageList = imageList.Substring(0, imageList.Length - 1);

                lastWeekManOfTheMatch = lastWeekManOfTheMatch.Substring(0, lastWeekManOfTheMatch.Length-1);

                round = round.Substring(0, round.Length - 1);

               

                hdWinningList.Value = imageList;

                hdLastWeekManOfTheMatch.Value = lastWeekManOfTheMatch;

                hdRound.Value = round;

            

                ClientScript.RegisterStartupScript(this.GetType(), "Message", "WinnerArrayInit();", true);

}