Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <base href="https://polygit.org/polymer+1.4.0/components/">
  <script src="webcomponentsjs/webcomponents-lite.min.js"></script>
  <link rel="import" href="paper-input/paper-input.html">
  <link rel="import" href="paper-tabs/paper-tabs.html">
  <link rel="import" href="paper-tabs/paper-tab.html">
  <link rel="import" href="iron-pages/iron-pages.html">
</head>
<body>
  <x-foo></x-foo>
  <dom-module id="x-foo">
    <template>
      <paper-tabs selected={{selected}}>
        <paper-tab>PAGE 1</paper-tab>
        <paper-tab>PAGE 2</paper-tab>
        <paper-tab>PAGE 3</paper-tab>
      </paper-tabs>
      <iron-pages selected=[[selected]]>
        <section>
          <h3>empty page 1</h3>
        </section>
        <section>
          <h3>page 2 inputs</h3>
          <paper-input></paper-input>
          <paper-input></paper-input>
          <paper-input id="my-input"></paper-input>
          <paper-input></paper-input>
        </section>
        <section>
          <h3>empty page 3</h3>
        </section>
      </iron-pages>
    </template>
    <script>
      Polymer({
        is: 'x-foo',
        properties: {
          selected: {
            type: Number,
            value: function() { return 1; }
          }
        },
        ready: function() {
          this.$['my-input'].focus();
        }
      });
    </script>
  </dom-module>
</body>
</html>
Output

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

Dismiss x
public
Bin info
tony19pro
0viewers