我已经从 materializecss 实现了“Toast” .我想为“Toast”消息提供一些固定位置。
为了解决问题,我添加了类并更新了位置,但是在不同的屏幕分辨率下,它出现在不同的位置。
Materialize.toast('Success Message', 6000, 'success');
任何人都曾尝试改变“Toast”消息的位置。 有没有其他方法可以使其在每个屏幕分辨率下保持一致。
最佳答案
用你需要的覆盖默认的 toast css:
#toast-container {
display: block;
position: fixed;
z-index: 10000
}
@media only screen and (max-width: 600px) {
#toast-container {
min-width: 100%;
bottom: 0%
}
}
@media only screen and (min-width: 601px) and (max-width: 992px) {
#toast-container {
left: 5%;
bottom: 7%;
max-width: 90%
}
}
@media only screen and (min-width: 993px) {
#toast-container {
top: 10%;
right: 7%;
max-width: 86%
}
}
关于javascript - 如何在 materializecss 中更改 "Toasts"的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44049534/