div中的弹道位置，位置绝对为

Question

我遇到弹出位置问题。

这就是它的样子：

这应该是这样的：

时间表上有position: relative;，弹出窗口有效，但时间表没有：

代码：

在我的html文件中，我有一个div位置：relative;

    <div id="bg-timetable" class="bg-timetable"/>

在我的JS中，我在其中创建了一个带有时间表的小div，其中包含position: absolute;。对于活动，我有一个功能：

   function createDivEvent(event) {
        var start = new Time(event.startTime);
        var end = new Time(event.endTime);

        var div = document.createElement("div");
        div.classList.add("event");

        div.id = event.id;
        div.style.top =  start.getPercent() + "%";
        div.style.height = (end.getPercent() - start.getPercent()) + "%";
        div.innerHTML = event.subject.name + " (" + event.place.name + ")";

        var a = document.createElement('a');
        a.setAttribute('tabindex', "0");
        a.setAttribute('data-toggle','popover');
        a.setAttribute('data-content','Some content inside the popover');
        a.setAttribute('title',div.innerHTML);

        a.appendChild(div);

        var d = new Date(event.date)
        document.getElementById(weekday[d.getDay()]).appendChild(a);
    }

你能帮助我吗？

Answer 1

好的我修好了：

function createDivEvent(event) {
        var start = new Time(event.startTime);
        var end = new Time(event.endTime);

        var div = document.createElement("div");
        div.id = event.id;
        div.innerHTML = event.subject.name + " (" + event.place.name + ")";

        var a = document.createElement('a');
        a.setAttribute('tabindex', "0");
        a.setAttribute('data-toggle','popover');
        a.setAttribute('data-content','Some content inside the popover');
        a.setAttribute('title',div.innerHTML);
        a.setAttribute('data-placement',"top");
        a.appendChild(div);
        a.style.top =  start.getPercent() + "%";
        a.style.height = (end.getPercent() - start.getPercent()) + "%";
        a.classList.add("event");

        var d = new Date(event.date)
        document.getElementById(weekday[d.getDay()]).appendChild(a);
    }

Css：

a.event {
    position: absolute;
    width: 95%;
    background-color: lightblue;
}