Jquery幻灯片显示.确定你在哪个幻灯片上

本文关键字:幻灯片 你在哪 显示 Jquery | 更新日期: 2023-09-27 18:13:28

我有一个由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 });
        });

Jquery幻灯片显示.确定你在哪个幻灯片上

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

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

所以你的问题是你使用id属性时,你应该使用CSS类来识别你的幻灯片元素