Search This Blog

Saturday, August 9, 2014

Variable Styling

Looking at options to dynamically control the styling.

Option 1.  Bind an attribute of an element to an attribute of the div.

<paper-toggle-button class="blue" checked="{{fadeSelected}}">

Then create a css rule that changes based on the value.
*[data-fade-selected="true"] {
  opacity: 0.3;
}

Option 2.  Call a function that changes a style attribute

For elements with change events, you can call a function on-change. In the function, you locate the id or class and then change the style.

$['drawerPanel'].style.display = 'none';


No comments:

Post a Comment