jquery弹出式滚动条和列对齐

-1

我正在寻找一个jQuery的弹出式菜单，它有一个垂直滚动条，并允许显示数据，就好像它在模仿Datagrid，除了行不可见的事实。jquery弹出式滚动条和列对齐

我的意思是类似的东西应该显示在弹出

字段1字段2字段3

值1值1值1

值2值2值2

如果这构成元素的lentgh列的长度比垂直滚动条应显示的屏幕高度更长，并允许替换值。

我搜索了一段时间，但没有找到任何东西，所以我希望你能帮助我解决这个问题，因为从零开始做起来似乎非常费时。

虽然我已经被命令通过jQuery来做它，但只要它能够工作，它并不重要，所以随意命名其他的替代品，如果它们存在的话，这些替代品是越来越少的，唯一的限制它是在客户端使用JavaScript完成的，因为其余的代码都是在这个基础上完成的。

感谢您的帮助。

来源

2014-11-25 mylket

对不起，表不显示正确，我试图改善它。 – mylket 2014-11-25 07:50:53

jquery对话框怎么样？你有没有尝试过一些东西？代码在哪里？ – 2014-11-25 07:56:35

对于你可以使用jQuery UI的对话框。为了满足其余的要求，只需添加一些CSS。这里有你的案例。我希望它可以帮助你：

<html> 
    <head> 
     <title></title> 
     <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
     <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script> 
     <style> 
      #dialog-content { 
       height: 200px; 
       /* Show scrolls if overflows! */ 
       overflow: scroll; 
      } 

      #dialog-content th, 
      #dialog-content td { 
       /* Big rows! */ 
       padding: 20px; 
      } 
     </style> 
     <script> 
      $(document).ready(function() { 
       $("#dialog").dialog(); 
      }); 
     </script> 
    </head> 
    <body> 
     <div id="dialog" title="Basic dialog"> 
      <div id="dialog-content"> 
       <table> 
        <thead> 
         <tr> 
          <th>Field1</th> 
          <th>Field2</th> 
          <th>Field3</th> 
          <th>Field4</th> 
          <th>Field5</th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <td>Value1</td> 
          <td>Value2</td> 
          <td>Value3</td> 
          <td>Value4</td> 
          <td>Value5</td> 
         </tr> 
         <tr> 
          <td>Value1</td> 
          <td>Value2</td> 
          <td>Value3</td> 
          <td>Value4</td> 
          <td>Value5</td> 
         </tr> 
         <tr> 
          <td>Value1</td> 
          <td>Value2</td> 
          <td>Value3</td> 
          <td>Value4</td> 
          <td>Value5</td> 
         </tr> 
         <tr> 
          <td>Value1</td> 
          <td>Value2</td> 
          <td>Value3</td> 
          <td>Value4</td> 
          <td>Value5</td> 
         </tr> 
        </tbody> 
       </table> 
      </div> 
     </div> 
    </body> 
</html>

来源

2014-11-25 08:04:18

jquery弹出式滚动条和列对齐

回答

相关问题