OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <!-- | |
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. | |
4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | |
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | |
7 Code distributed by Google as part of the polymer project is also | |
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | |
9 --> | |
10 <html> | |
11 <head> | |
12 <title>Selection</title> | |
13 <script src="../platform/platform.js"></script> | |
14 <link rel="import" href="core-selection.html"> | |
15 </head> | |
16 <body unresolved> | |
17 | |
18 <polymer-element name="selection-example"> | |
19 <template> | |
20 <style> | |
21 polyfill-next-selector { content: 'ul > *'; } | |
22 ::content > * { | |
23 cursor: pointer; | |
24 } | |
25 | |
26 polyfill-next-selector { content: 'ul > .selected'; } | |
27 ::content > .selected { | |
28 font-weight: bold; | |
29 font-style: italic; | |
30 } | |
31 </style> | |
32 | |
33 <ul on-tap="{{itemTapAction}}"> | |
34 <content></content> | |
35 </ul> | |
36 | |
37 <core-selection id="selection" multi on-core-select="{{selectAction}}"></c
ore-selection> | |
38 | |
39 </template> | |
40 <script> | |
41 Polymer('selection-example', { | |
42 itemTapAction: function(e, detail, sender) { | |
43 this.$.selection.select(e.target); | |
44 }, | |
45 selectAction: function(e, detail, sender) { | |
46 detail.item.classList.toggle('selected', detail.isSelected); | |
47 } | |
48 }); | |
49 </script> | |
50 </polymer-element> | |
51 | |
52 <selection-example> | |
53 <li>Red</li> | |
54 <li>Green</li> | |
55 <li>Blue</li> | |
56 </selection-example> | |
57 | |
58 </body> | |
59 </html> | |
OLD | NEW |