javascript - CSS在Material Design Lite和Drift之间的冲突

我想使用材质精简版（https://github.com/imgix/drift）在Web应用程序中使用Drift.js（https://getmdl.io/）的缩放功能，但无法正常工作。我能够将其范围缩小到一个css问题，但是我有点卡在这里。

这里有2个小提琴，唯一的技术区别是在第二个小提琴中没有材料设计lite css。

第一个小提琴：https://jsfiddle.net/mbitard/b41g2f0y/

new Drift(document.querySelector('img'), {
        paneContainer: document.querySelector('p'),
        inlinePane: true,
        inlineOffsetY: 0,
        containInline: true
});

第二个小提琴：https://jsfiddle.net/qankkgLe/2/

放大第一个小提琴不起作用。

最佳答案

看来<main>元素的z索引大于缩放。

通过将z-index: 100;添加到.drift-zoom-pane.drift-inline { css类，我可以再次缩放。

关于javascript - CSS在Material Design Lite和Drift之间的冲突，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37727288/