jquery幻灯片放映。确定您所在的幻灯片AKA Div

时间:2011-11-03 05:00:09

标签: c# jquery asp.net html css

我有一个由div组成的幻灯片。每个Div包含一张图片和一些HTML控件。我有一个问题,如果你点击其中一个控件,在第一个以外的幻灯片上,它只会更新第一个。只有幻灯片之间发生变化的是显示屏,当你进行幻灯片放映时,它会从无切换到阻止。在jquery中是否有任何方法可以在不执行每个语句并且搜索哪个类未被隐藏的情况下更改该幻灯片?谢谢你的帮助。

 <div class="TheSlide">
      <table>
      <tr>
      <td>

          <div id="divSlideImage"> <asp:HiddenField runat="server" ID="HiddenField1" Value='<%#Eval("ID") %>' />
              <asp:ImageButton runat="server" CssClass="AlbumImageView" Height="480" ID="MainPicture"
                  ImageUrl='<%#Eval("PhotoMainImageURL") %>' AlternateText="Slide not showing properly. Refresh Page." />
                  <div id="pictureTagBorder"></div>
                  </div>

 <div class="TheSlide">
      <table>
      <tr>
      <td>

          <div id="divSlideImage"> <asp:HiddenField runat="server" ID="HiddenField1" Value='<%#Eval("ID") %>' />
              <asp:ImageButton runat="server" CssClass="AlbumImageView" Height="480" ID="MainPicture"
                  ImageUrl='<%#Eval("PhotoMainImageURL") %>' AlternateText="Slide not showing properly. Refresh Page." />
                  <div id="pictureTagBorder"></div>
                  </div>

我试图在用户点击控件时将此类标记为图片,但它只会在第一张幻灯片上执行此脚本。

  $(document).ready(function () {
            var top = y - 232;
            var left = x - 145;
            $('#pictureTagBorder').css({ top:top , left: left });
        });

1 个答案:

答案 0 :(得分:2)

pictureTagBorder不是类,它是id属性。您的id属性必须在每个页面上都是唯一的,我猜您有多个元素包含id="pictureTagBorder"id="divSlideImage"(可能还有其他元素),因此您的HTML是无效的。 ID选择器(例如#pictureTagBorder)最多只匹配一个元素,您可以说

  

它只会在第一张幻灯片上执行此脚本

因此,当您使用CSS类来识别幻灯片元素时,您的问题是您正在使用id属性。