Question

当我更改div的位置时，我试图让CSS转换工作。它是从页面底部弹出的水平形式。

HTML：

<div class="admin-bar hidden" id="quick-access">
    <div class="admin-bar-inner">
        // form content

CSS：

.page-content .admin-bar {
    bottom: 0;
    right: 0;
    left: 0;
    position: fixed;
    width: 100%;
}

.page-content .hidden {
    bottom: -140px;
}

#quick-access {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

JS：

// to view the form
$('#raiseForm').on( "click",function() {
    $("#quick-access").removeClass("hidden");
});

// on submit or cancel
$("#quick-access").addClass("hidden");

不幸的是，我根本没有完成过渡，只是弹出和弹出的部分。我选择添加删除课程，因为这是使其具有响应性的最简单方法。

感谢任何帮助。

Answer 1

在考虑课程名称时，请确保您实际使用的内容是唯一的。＆＃34;隐藏＆＃34;被bootstrap.css中的类覆盖：

.hidden {
    display:none !important
}

将隐藏更改为其他内容解决了问题。

CSS跨越像素距离

1 个答案: