Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.3/platform.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.3/polymer.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
​
  <polymer-element name="flatter-navbar-toggle" on-click="{{ toggle }}" attributes="toggled">
      <template>
          <link rel="stylesheet" href="flatter-navbar-toggle.css"/>
          <div>
              <span>[Button]</span>
              <span></span>
              <span></span>
          </div>
      </template>
      <script>
          Polymer('flatter-navbar-toggle', {
              toggled: false,
              toggle: function () {
                  this.toggled = !this.toggled;
              }
          })
      </script>
  </polymer-element>
​
  <polymer-element name="flatter-navbar" noscript>
      <template>
          <flatter-navbar-toggle toggled="{{toggled}}"></flatter-navbar-toggle>
​
          <template if="{{toggled}}">
          <div>
              <content>
​
              </content>
          </div>
        </template>
      </template>
  </polymer-element>
​
  
  <flatter-navbar>test body</flatter-navbar>
​
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
erikringsmuthpro
0viewers