How do I turn off the ripple effect in polymer paper elements?
I am writing a mobile web application using polymer
which will be packaged with phonegap
to run on an android device. I am using polymer paper-tabs
and core-animated-pages
to show the switching effect. Everything works well on the device except ripple effect
for the tab. It makes the whole thing look ugly and laggy. How do I turn off the ripple effect on paper tabs (and eventually every other piece of paper)?
I tried setting the property noink
to true
in the source of paper tabs as follows, but it doesn't work.
Polymer('paper-tabs', {
/**
* If true, ink ripple effect is disabled.
*
* @attribute noink
* @type boolean
* @default false
*/
noink: true,
source to share
You can use the attribute noink
on elements that have a ripple effect to turn it off:
<paper-button noink>No ink!<paper-button>
<paper-tabs noink>...<paper-tabs>
AFAICT, the former may not work until the next release of the paper with polymer. It works in the wizard, however, if you want to bleed on the edge.
source to share