diff options
Diffstat (limited to 'README.md')
-rw-r--r-- | README.md | 22 |
1 files changed, 16 insertions, 6 deletions
@@ -126,14 +126,24 @@ After `generateMaps()`, the container has the following structure: | |||
126 | 126 | ||
127 | Dumbymap switch layouts by attribute `data-layout` of container. Most of the features are done by pure CSS. | 127 | Dumbymap switch layouts by attribute `data-layout` of container. Most of the features are done by pure CSS. |
128 | 128 | ||
129 | You can add custom layout by options `layouts`: | 129 | You can add custom layout by options `layouts`. For example, the following code add a new layout `sticky` to stick `Showcase` at bottom right corner: |
130 | |||
131 | ```css | ||
132 | .Dumby[data-layout='sticky'] { | ||
133 | .Showcase { | ||
134 | display: block; | ||
135 | width: 20vw; | ||
136 | height: 40vh; | ||
137 | position: absolute; | ||
138 | right: 0; | ||
139 | bottom: 0; | ||
140 | background: red; | ||
141 | } | ||
142 | } | ||
143 | ``` | ||
130 | 144 | ||
131 | ```js | 145 | ```js |
132 | generateMaps(container, { | 146 | generateMaps(container, { layouts: "sticky" }) |
133 | layouts: [ | ||
134 | "LAYOUT-NAME" | ||
135 | ] | ||
136 | }) | ||
137 | ``` | 147 | ``` |
138 | 148 | ||
139 | 149 | ||