Mercurial > libervia-templates
annotate default/static/css.js @ 29:494d740aa3d6
static/css.js: added clicked_cls function:
this function toggle "clicked" class on each click, and remove "init" class on first click. Useful to make CSS react easily on clicks.
author | Goffi <goffi@goffi.org> |
---|---|
date | Sat, 24 Jun 2017 20:25:39 +0200 |
parents | c319291943be |
children | e296ee56f611 |
rev | line source |
---|---|
15
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
1 function set_clicked_class_tag(tag_name, class_name='clicked') { |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
2 for (let elt of document.getElementsByTagName(tag_name)) { |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
3 elt.classList.toggle(class_name); |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
4 } |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
5 } |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
6 |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
7 function set_clicked_class_id(trigger_elem_id, target_elem_id=null, class_name='clicked') { |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
8 if (target_elem_id === null) { target_elem_id = trigger_elem_id; } |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
9 document.getElementById(trigger_elem_id).addEventListener( |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
10 "click", |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
11 function() { |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
12 document.getElementById(target_elem_id).classList.toggle(class_name); |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
13 } |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
14 ); |
c319291943be
static: css.js (library for basic style manipulation) first draft
Goffi <goffi@goffi.org>
parents:
diff
changeset
|
15 } |
29
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
16 |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
17 function clicked_cls(elt) { |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
18 /* toggle "clicked" class on each click, and remove "init" class if present */ |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
19 // init |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
20 if (elt.classList.contains("init")) { |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
21 elt.classList.remove("init"); |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
22 } |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
23 |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
24 // clicked |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
25 elt.classList.toggle("clicked"); |
494d740aa3d6
static/css.js: added clicked_cls function:
Goffi <goffi@goffi.org>
parents:
15
diff
changeset
|
26 } |