我敢肯定以前必须提到/问过,但一直在寻找没有运气的年龄,我的术语一定是错的!
我依稀记得我刚才看到的一条推文,它提示有一条css规则可以删除以前在样式表中为特定元素设置的任何样式.
一个很好的使用示例可能是在移动优先的RWD站点中,其中用于小屏幕视图中的特定元素的大部分样式需要"重置"或移除桌面视图中的相同元素.
一个css规则,可以实现如下:
.element {
all: none;
}
Run Code Online (Sandbox Code Playgroud)
用法示例:
/* mobile first */
.element {
margin: 0 10;
transform: translate3d(0, 0, 0);
z-index: 50;
display: block;
etc..
etc..
}
@media only screen and (min-width: 980px) {
.element {
all: none;
}
}
Run Code Online (Sandbox Code Playgroud)
因此,我们可以快速删除或重新设置样式,而无需声明每个属性.
说得通?
我最近遇到了一个名为cordova-plugin-qrscanner(https://github.com/bitpay/cordova-plugin-qrscanner)的相当新的cordova插件.我之前一直在使用其他QR扫描仪,但这些只是覆盖某种原生相机UI,直到QR被扫描然后返回到应用程序.
但是,这个插件的方法有点不同.实际上,相机显示在您的应用程序"后面",您必须使所有内容都透明才能看到它.
这非常有趣,因为您可以使用HTML和CSS轻松添加自定义叠加层.但是,我不太清楚这里最好的方法是什么.
添加插件后,只是调用QRScanner.scan(displayContents);你看不到任何东西,但扫描仪已经在后台运行.然后,我从应用程序中递归删除任何样式(请参阅删除页面中所有样式的最简单方法),并将background-color设置为透明,以查看它是否有效.它确实如此,但我显然仍然可以看到之前显示的文本.
我想我可以创建并推送带有叠加层的新页面,将背景颜色设置为透明,然后在扫描代码后导航回来.但这感觉非常黑客.
有人有更好的解决方案吗?
例如,有没有办法用覆盖层"交换"应用程序的整个可见部分,并在扫描代码后恢复状态?
谢谢你的帮助.
编辑:
它不是同一个插件,但这篇文章与我的问题相关.
http://www.joshmorony.com/ionic-go-create-a-pokemon-go-style-interface-in-ionic-2/
应用css样式有效,但同样,应用程序的其余部分无法使用.