Previously, I detailed a couple tools for your games: inline dice rolls (and its advanced update) and random tables. That's two great tastes that taste great together. We can combine these two tools to create a new way to present an old idea: the random encounter table.
To use the tool, set up a table just as you did with the original random tables tool. It can use the
data-weight custom data attributes if you need them. In the example code here, I included a class
scale that uses the CSS
transform property to make the rolled entry "pop" a little to draw the eye, but this is optional and dependent on your visual design.
Inside each entry, you can include any number of
span elements with the
dice-roll class to indicate inline dice rolls as with the original tool. The example code uses the full suite of options from the advanced update.
When the user clicks your table, it randomly selects an entry. If that entry has any inline dice rolls, they are rolled and the result overlayed on the dice notation. (To produce a cleaner experience, clicking a dice notation directly won't roll the dice, but it will trigger a random selection from the table.)
Clicking to select another random entry will clear any inline dice results, as will clicking on the selected entry to clear the table.
And now, I'll leave you with an example encounter table that selects a random Level 1 dungeon encounter for 3.5-edition fantasy:
|01–03||1d3 Medium monstrous centipedes (vermin)|
|04–08||1d4 dire rats|
|09–10||1d4 giant fire beetles (vermin)|
|11–13||1d3 Small monstrous scorpions (vermin)|
|14–16||1d3 Small monstrous spiders (vermin)|
|17–20||1d3 dwarf warriors|
|21–22||1d3 elf warriors|
|29–30||1 lemure (devil)|
|31–40||1d3+1 goblin warriors|
|41–50||1d4+2 kobold warriors|
|51–56||1d4 human warrior skeletons|
|57–62||1d3 human commoner zombies|
|63–71||1d4+1 Tiny viper snakes (animal)|
|72–80||1d3 orc warriors|
|86–90||1 spider swarm|
|91–100||Roll on 2nd-level table|