如果我没有记错,最近这种情况已经改变了。 看看这里的例子:
http://jsbin.com/fujasojilu/edit?html,output
我想要的行为与左下角相同,但是从右上角开始。
我该怎么做?
答案 0 :(得分:5)
paper-toast
是在material design spec for snackbars & toasts之后创建的,它指定了:
入口处,小吃店从屏幕的底部边缘向上动画。当它们出现时,它们不会阻止输入。
所以他们并没有真正为我们提供改变动画方向的方法。
但是,您可以使用fitInto
属性使吐司出现在某个容器中,如果您将该容器设置为在窗口顶部具有固定位置,则可以获得类似的行为你想要什么。
以下是如何执行此操作的示例:
<div id="container" style='position: fixed; top:60px; right:10px; width: 100%;'></div>
<paper-button raised onclick="toast0.open()">Default toast</paper-button>
<paper-toast class="fit-bottom" id="toast0" text="This toast auto-closes after 3 seconds"></paper-toast>
<script>
toast0.fitInto = container;
</script>
这是bin,展示了它的外观。
如果你真的需要来自屏幕右上角的吐司,动画有意义,那么我建议你为此制作自己的元素。
编辑:在customelements.io中快速搜索显示有人已经处理过这种元素。有一个名为toast-er,除其他外,让你从任何角落出现吐司。