Question

我在HTML表格的顶部创建了一个水平滚动条。我一直在关注这个例子：

horizontal scrollbar on top and bottom of table

这是我的代码:(我没有提到try{ $fitbitConnection = new FitbitConnection(); $token_response = $fitbitConnection->getToken("https://api.fitbit.com/oauth2/token","22942C","client_secret","1234567890","http://www.example.com"); echo $token_response; }catch(Exception $e){ // curl error echo $e->getMessage(); }或.wrapper2：

HTML

.div2

CSS

<div class="wrapper1">
    <div class="scrollTop"></div>
</div>
<div class="tableData">
    <table>
        "..."              
    </table>
</div>

JS

.tableData {
    box-shadow: 10px 10px 5px #000;

    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    overflow: auto;
}

.wrapper1, .tableData {
    margin: 20px;
    overflow-x: scroll;
    overflow-y: hidden;
}

.wrapper1 {
    height: 20px;
}

.scrollTop {
    width: 1000px;
    height: 20px;
}

我的问题是我的顶部滚动条不可见。它的容器不是实际的条形本身（如你所见）：

所有的JS都运行正常，所以认为它在CSS中是一个问题？我不太确定。

修改

从上面的屏幕截图中，您可以看到其容器内的底部滚动条是可见的，因此可以与之交互。但是，顶部滚动条不是。它的容器是可见的，但实际的栏本身不是这样，不能与之交互，也无法滚动。

Answer 1

将CSS更改为：

.wrapper1, .tableData {
    width: 100%; 
    border: none 0px RED; 
    overflow-x: scroll; 
    overflow-y:hidden;
}

.tableData {
    box-shadow: 10px 10px 5px #000;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
}

.wrapper1 {
    height: 20px; 
}

.tableData{
     height: 200px; 
}
.scrollTop {
    width:1000px; 
    height: 20px; 
}

table {
    width:1000px; 
    height: 200px; 
    overflow: auto;
}

工作示例： http://jsfiddle.net/ggChris/d8ayfnnp/

Answer 2

更改您的CSS

import tkinter
from tkinter import * 
root=Tk()
flag=0
a={'x','y','z'}  # Consider these as columns in database
for i in a:
    i=Entry(root)
    i.pack()
def getter():
    for i in a:
        b=i.get()  # i is read as string and not as variable                    
        print(b)
asdf=Button(root,text='Enter',command=getter)
asdf.pack()
root.mainloop()

演示链接 http://jsfiddle.net/TBnqw/3144/

顶部滚动条不可见

2 个答案: