2016-12-27 46 views
0

私はこのリピータのASP要素を持っている:リピータ要素をスクロール可能にする方法は?

<asp:Repeater ID="PervousResultsList" runat="server" EnableViewState="False" > 
     <ItemTemplate> 
      <div class="row1"> 
       <table style="width: 100%"> 
        <tr> 
         <td rowspan="4" onclick="parent.parent.ZoomToView(<%# Eval("Lon") %>, <%# Eval("Lat") %>, 2500)" style="cursor: pointer;"> 
          <asp:Image ID="Image1" ImageUrl="~/Images/pushpinred.png" runat="server" Width="32" 
           Height="32" /></td> 
        </tr> 
        <tr> 
         <td></td> 
         <td></td> 
         <td></td> 
         <td rowspan="10"> 
          <asp:Image class="toggleRow" ImageUrl="~/Images/vertical-dots.png" runat="server" Width="32" 
           Height="32" Style="height: 30px; position: relative; float: left; cursor: pointer;" /></td> 
         </td> 
        </tr> 
        <tr class="pointDescArea"> 
         <td>text:</td> 
         <td rowspan="2"> 
          <h1 style="color: gray"><%# Eval("Text") %></h1> 
         </td> 
        </tr> 
        <tr class="hidden"> 
         <td>X:</td> 
         <td><%# Eval("Lon") %></td> 
        </tr> 
        <tr class="hidden"> 
         <td>Y:</td> 
         <td><%# Eval("Lat") %></td> 
        </tr> 
        <tr> 
       </table> 
      </div> 
     </ItemTemplate> 

     <AlternatingItemTemplate> 
      <div class="row2"> 
       <table style="width: 100%"> 
        <tr> 
         <td rowspan="4" onclick="parent.parent.ZoomToView(<%# Eval("Lon") %>, <%# Eval("Lat") %>, 2500)" style="cursor: pointer;"> 
          <asp:Image ID="Image1" ImageUrl="~/Images/pushpinred.png" runat="server" Width="32" 
           Height="32" /></td> 
        </tr> 
        <tr> 
         <td></td> 
         <td></td> 
         <td></td> 
         <td rowspan="10"> 
          <asp:Image class="toggleRow" ImageUrl="~/Images/vertical-dots.png" runat="server" Width="32" 
           Height="32" Style="height: 30px; position: relative; float: left; cursor: pointer;" /></td> 
         </td> 
        </tr> 
        <tr class="pointDescArea"> 
         <td>טקסט:</td> 
         <td rowspan="2"> 
          <h1 style="color: gray"><%# Eval("Text") %></h1> 
         </td> 
        </tr> 
        <tr class="hidden"> 
         <td>X:</td> 
         <td><%# Eval("Lon") %></td> 
        </tr> 
        <tr class="hidden"> 
         <td>Y:</td> 
         <td><%# Eval("Lat") %></td> 
        </tr> 
        </tr> 
       </table> 
      </div> 
     </AlternatingItemTemplate> 
    </asp:Repeater> 

は、私はそれが500pxなどへの高さだ設定とスクロール可能にする必要があります。

このリピータを垂直にスクロール可能にするにはどうすればよいですか?

答えて

1

は、div内のリピーターを置くのdivの高さを設定し、理想的なスタイリングがstyleタグやスタイルシートにする必要がありますが、私はちょうどデモのためにインラインで表示していますoverflow-y

<div style="height: 500px; overflow-y: scroll;"> 
    <asp:Repeater ID="PervousResultsList" runat="server" EnableViewState="False" > 
    ... 
    </asp:Repeater> 
</div> 

を使用しています。

+0

最大の高さで高さを動的にすることはできますか? – Michael

+0

もし必要ならばリピータが500pxしか使わないようにするには、外側divの 'height'プロパティを' max-height'に変更することができます。また、最大高さに達したときにスクロールバーを表示させたい場合は、 'overflow-y'を' auto'に設定することができます。 – bpechkis

関連する問題