Question

我坚持一个问题。我有主页，我在标题中使用横幅。我在更新面板中为横幅图像设置了一个计时器。但是一旦我向下滚动页面阅读主页文本，页面就会刷新并滚动到顶部。

您可以通过以下链接查看此问题：

http://www.sspos.net/mb/index.aspx

这是我的代码：

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

     <asp:UpdatePanel runat="server" ID="SlideShow" UpdateMode="Always">
    <ContentTemplate>
   <div id="lsmoke">
<div class="displayimg">
     <asp:Timer runat="server" Interval="5000" ID="SlideShowTimer" OnTick="SlideShowTimer_Tick" />
         <img runat="server" id="SlideShowImage1" src="Images/lsmoke_banner2.PNG"   class="displayimg" style="width:720px;"
            alt="" />
    </div>
       </div>
        </ContentTemplate>

                             <Triggers>

        <asp:AsyncPostBackTrigger ControlID="SlideShowTimer" EventName="Tick" />
    </Triggers>

          </asp:UpdatePanel>


    <p>
    Prime Wholesale is an online wholesaler of general merchandise and
    <span id="e1cak1u_2" class="e1cak1u">tobacco</span>
    products.
    </p>


        <p>
    Our tobacco product selection includes pipe tobacco, premium and machine rolled
    <span id="e1cak1u_1" class="e1cak1u">cigars</span>
    and cigarillos, little and filtered cigars, hookahs, glass pipes, RYO and other smoking accessories.
    </p>
    <p>While we accept orders of any dollar amount, our pricing model is trimmed for bigger orders and targets gas stations, convenience stores, tobacco stores, cigar stores and other business customers.</p>
    <p>In particular, our prices are as low as possible while shipping cost is rather high.</p>
    <p>However, as soon as your order exceeds $500 value, we will ship your order for $1.</p>
    <p>Some products may be sold at a price below minimum retail price allowed by manufacturer. We can do that only because we're not a retail business and we offer the products in wholesale quantities.</p>
    <p>The most preferrable form of payment for us is bank transfer, but we also accept major credit cards.</p>




         <ajax:UpdatePanelAnimationExtender runat="server" ID="UPextender" TargetControlID="SlideShow"
        BehaviorID="animation">
        <Animations>
           <OnUpdating>

                <FadeOut Duration=".5" Fps="20" minimumOpacity=".1" />
            </OnUpdating>
            <OnUpdated>

                <FadeIn Duration="1.5" Fps="20" minimumOpacity=".1" />
            </OnUpdated>
        </Animations>
    </ajax:UpdatePanelAnimationExtender>






    </asp:Content>

以下是代码背后的代码：

      Protected Sub SlideShowTimer_Tick(sender As Object, e As EventArgs)
        Dim later As DateTime = DateTime.Now.AddSeconds(0.5)

        While DateTime.Now < later
        End While
        Me.SlideShowImage1.Src = RandomImageName()


    End Sub

    Private Function RandomImageName() As String
        Dim rand As New Random()
        Dim RandomInt As Integer = rand.[Next](0, 5)
        Select Case RandomInt
            Case 0
                Return "Images/lsmoke_banner1.PNG"
                Exit Select
            Case 1
                Return "Images/lsmoke_banner2.PNG"
                Exit Select
            Case 2
                Return "Images/lsmoke_banner3.PNG"
                Exit Select
            Case 3
                Return "Images/lsmoke_banner4.PNG"
                Exit Select
            Case 4
                Return "Images/lsmoke_banner5.PNG"
                Exit Select
            Case 5
                Return "Images/lsmoke_banner1.PNG"
                Exit Select
            Case Else
                Return "Images/lsmoke_banner2.PNG"
                Exit Select
        End Select
    End Function

请告诉我哪里出错了。

Answer 1

您正在使用每次刷新页面的服务器端组件，尝试使用客户端组件（如javascript脚本）来更改图片，这将确保每个周期都不刷新页面。

这个的一些例子

http://jquery.malsup.com/cycle/

http://blog.lynda.com/2012/02/10/create-a-jquery-photo-rotator-in-15-lines-of-code/

整个页面甚至刷新更新面板内的控件

1 个答案: