Browsers such as Safari do not natively understand ES6 functions, thus during development only Chrome can be used when the hover box is imported into the page.
(On Safari the following error occurs: ```SyntaxError: Unexpected token ')'
appendChild — index.html:77
hoverBox — template.v1.js:18012
renderOnLoad — template.v1.js:18217
(anonymous function) — template.v1.js:18227
```, this is caused by the function arrow notation not being parsed).
Relying on the mouse events made the boxes on touch screens really
janky. I have:
- Made opening/closing the touch box purely use touchstart events
so it is more reliable and responsive
- Made tapping anywhere outside the box close it
- Refactored binding into separate link and div functions so that
the touch events can be bound correctly
