CODEWITHSUNDEEP
javascripthtmlreveal.js
M. Ryan
M. Ryan

Reputation: 7192

How to enable links outside of Slides in reveal.js

I have a large reveal.js presentation that I'd like to add some chapter control feature too. Naturally this sort of control needs to exist outside of the slides themselves and appear opposite of the normal arrow controls.

When adding this feature, I create a DIV with an inside of it. It is placed as the first element inside of the <div class="reveal"> tag.

For the sake of demo purposes:

<aside id="linkage"><a href="http://www.google.com" id="expander" class="enabled">Expand</a></aside>

Through CSS I've gotten this to display exactly where I want it. All is well.

However it seems that Reveal does something to disable this link. It is not clickable at all, although an inspection of the DOM at runtime appears to suggest that the tag has been left intact.

By what means is Reveal disabling this link, and what should I do to circumvent this problem?

Upvotes: 3

Views: 1319

Answers (1)

M. Ryan
M. Ryan

Reputation: 7192

The cause of this is the .state-background DIV that appears to overlay the entire window in conjunction with position:absolute;

I have resolved this issue by enforcing a z-index on the .state-background div to have it render below my set of controls.

Upvotes: 2

Related Questions