I am using a vertical slider for my whole webpage. To move between each page I want to click the top/ bottom of the page to navigate between slides. To do this I have placed a div at the top and bottom of each page and when you click that div it brings you to the next/prev slide but these divs are covering some of my content on certain pages. Is there a way to make the divs 'transparent' in colour but still available to click as a link? Sorry if I haven't explained myself properly i am new to HTML an CSS.
Asked
Active
Viewed 7,261 times
3
-
look for `css + opacity` – Tim Vermaelen May 02 '13 at 22:25
-
http://stackoverflow.com/questions/3680429/click-through-a-div-to-underlying-elements should get you going. – May 02 '13 at 22:25
-
If it is not working, I'd suggest using `z-index` in your styles to make sure they are on top. Do you have code you can provide? – David Starkey May 02 '13 at 22:25
-
3Correct me if I'm wrong, but the duplicate is asking the opposite of this. This question is trying to receive clicks using a transparent div, the duplicate is trying to ignore them. I believe that this question has been incorrectly marked as a duplicate. – Oliver Cooper Oct 11 '13 at 08:33
1 Answers
2
I'm not sure I get this problem - divs are empty by default (there's nothing in them to make transparent) so as long as you have assigned the clickable div some dimensions it should create a region you can click on where it is located on the page.
e.g. http://jsfiddle.net/pWpAD/ [Top 50px pixels of the box are clickable].
div {
width: 300px;
height: 300px;
}
#backdiv {
background-color: #f0f;
}
#topdiv {
height: 50px;
cursor: pointer;
}
If I've not understood your question let me know. Maybe can you provide some code?

Tim Ackroyd
- 636
- 8
- 24