在其他元素之上显示日历

Question

我的日历很费力，因为它实际上在页面中占用了太多 space。

日历最初是隐藏的：

Visible="False"

然后当我点击 select 按钮时，我会显示日期：

protected void btnCalendar_Click(object sender, ImageClickEventArgs e)
    {
        if (Calendar1.Visible)
        {
            Calendar1.Visible = false;
        }
        else
        {
            Calendar1.Visible = true;
        }
    }

问题是日历无论如何都会占用页面中的 space，即使它是隐藏的，当它打开时页面变得漂亮 "awkward"。

我希望日历显示在页面上其他项目的顶部，就在 "upper level" 上，这样它就不会将页眉从页面中间分开。

有没有办法用 html 或 css 做到这一点？我试图将日历放入 div，但后来我找不到任何有用的关于我需要的东西

Answer 1

使用'display:none','visibility:hidden'隐藏元素但发生 Take a look at this link

Answer 2

2 个选项...可见不是其中之一。

你可以使用

display: none;

在您的 CSS 中，如上所示。设置显示 none 不显示该元素，甚至在页面上为其腾出空间。

更好的选择（为了美观）是使用位置、不透明度、z-index 和指针事件。这会花费更多时间，但您可以选择将元素转换到位。

#Calendar1.show {
position: absolute;
z-index: 1000;
opacity: 1;
pointer-events: auto;
transition: opacity 0.5s ease;
}

#Calendar1.hide {
opacity: 0;
pointer-events: none;
}

然后只需更改 class 即可显示或隐藏元素...

丹尼

在其他元素之上显示日历

show calendar on top of other elements

html

javascript

css

jquery

calendar