полоса прокрутки в jquery + asp.net

У меня есть таблица, как показано ниже, которая отображается с пользовательского элемента управления asp.net.полоса прокрутки в jquery + asp.net

Можно ли добавить горизонтальную полосу прокрутки в эту таблицу с первым столбцом и последним столбцом как фиксированным? Есть ли способ сделать это без изменения текущей структуры html?

<div class="someclass" id="overVw"> 
    <table id="overVwTbl"> 
    <thead> 
     <tr class="abc"> 
     <th class="header">Displays</th> 
     <th class="header">08/19</th> 
     <th class="header">08/21</th> 
     <th class="header">08/26</th> 
     <th class="header">09/09</th> 
     <th class="header">09/23</th> 
     <th class="header">10/07</th> 
     <th class="header"> Avg. grade </th> 
     </tr> 
    </thead> 
<tbody> 
    <tr class="sari"> 
     <td class="base"> 
      <span title="Display One">Display One</span> 
     </td> 
     <td class="val">1</td> 
     <td class="val">10</td> 
     <td class="val">51</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="abc">0.46</td> 
    </tr> 

    <tr class="odd"> 

     <td class="base"> 
      <span title="Display Two">Display two</span> 
     </td> 
     <td class="val">12</td> 
     <td class="val">13</td> 
     <td class="val">41</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="abc">1.38</td> 
    </tr> 

    <tr class="sari"> 
     <td class="base"> 
      <span title="Display Three">Display Three</span>       
     </td> 
     <td class="val">31</td> 
     <td class="val">80</td> 
     <td class="val">51</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="abc">0</td> 
    </tr> 

</tbody> 
<tbody class="avoidSort"><tr class="xyx"> 

     <td class="base"> 
      <span title="Totals">All</span> 

     </td> 
     <td class="val">1</td> 
     <td class="val">10</td> 
     <td class="val">51</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="abc"> 

     </td> 

    </tr> 
    </tbody> 
    </table> 
</div>

источник

2013-12-04 mmssaann

Не в таблице я не думаю. Если бы это был div, вы могли использовать переполнение: прокрутка, но я просто попытался применить это к таблице, и это не сработает. http://jsfiddle.net/FJpc8/ – Liam

почему два ' s' есть – Jai

@Jai, чтобы упростить группировку строк, я думаю. –

-1

Попробуйте это будет, как работает, как у

ожидается

CSS:

<style> 
.flexcroll{ 
height: 124px; 
text-align: center; 
overflow-y: auto; 
overflow-x: hidden; 
width: 257px; 
} 
</style>

HTML `

<table class="head" id="table1" style="border-bottom-style: groove;border-bottom-width: thin;border-bottom-color: #FFC202;" > 
              <tr class="brkDwnDivComposite-first brkDwnDivComposite-last brkDwnDivComposite-even"> 
     <th class="brkDwnDivComposite-first ascending header">Metric</th> 
     <th class="header">08/19</th> 
     <th class="header">08/21</th> 
     <th class="header">08/26</th> 
     <th class="header">09/09</th> 
     <th class="header">09/23</th> 
     <th class="header">10/07</th> 
     <th class="brkDwnDivComposite-last header"> Avg. grade </th> 
     </tr> 
</table> 
<div class="flexcroll"> 
<table style="width:260px;padding-left: 11px;"> 
<tr class="brkDwnDivComposite-first brkDwnDivComposite-even"> 
     <td class="brkDwnDivComposite-first metricName bgClr0"> 
      <span title="7 Day Email Follow-up">7 Day Email Follow-up</span> 
     </td> 
     <td class="val">1</td> 
     <td class="val">10</td> 
     <td class="val">51</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="brkDwnDivComposite-last avgGrade">0.46</td> 
    </tr> 

    <tr class="brkDwnDivComposite-odd"> 

     <td class="brkDwnDivComposite-first metricName bgClr1"> 
      <span title="7 Day Phone Follow-up">7 Day Phone Follow-up</span> 
     </td> 
     <td class="val">12</td> 
     <td class="val">13</td> 
     <td class="val">41</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="brkDwnDivComposite-last avgGrade">1.38</td> 
    </tr> 

    <tr class="brkDwnDivComposite-even"> 
     <td class="brkDwnDivComposite-first metricName bgClr2"> 
      <span title="Alternative Suggestions Count">Alternative Suggestions Count</span>       
     </td> 

     <td class="val">31</td> 
     <td class="val">80</td> 
     <td class="val">51</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="brkDwnDivComposite-last avgGrade">0</td> 
    </tr> 
</table> 
</div> 
<table> 
<tbody class="avoidSort"><tr class="brkDwnDivComposite-last brkDwnDivComposite-even totTblData"> 
<td class="brkDwnDivComposite-first metricName"> 
<span title="Totals">Totals</span> 
     </td> 
     <td class="val">1</td> 
     <td class="val">10</td> 
     <td class="val">51</td> 
     <td class="val">81</td> 
     <td class="val">11</td> 
     <td class="val">12</td> 
     <td class="brkDwnDivComposite-last avgGrade"> 
     </td> 
    </tr> 
    </tbody> 
</table>

источник

2013-12-04 11:39:25

brkDwnDivComposite - это не правильный идентификатор? – mmssaann

Не делает ничего http://jsfiddle.net/FJpc8/1/. Почему ты не попробовал? – Liam

это не помогает – mmssaann

полоса прокрутки в jquery + asp.net

ответ

Смежные вопросы