0

Hi, i'm trying to achieve the exact same effect as the 4 bottom tabs of this page :

http://uk.virginmoney.com/virgin/

Most Jquery I have seen 'pushes' the content above or below it up or down the page as it reveals the hidden content, the above example reveals the content over the top without pushing out any other content which is what I am looking for

I have tried to take the code and everything works aside from those tabs!! I was hoping somebody has a link to another site that does the same effect or if anyone can help??

Thanks in advance

Mike

2
Contributors
1
Reply
2
Views
7 Years
Discussion Span
Last Post by almostbob
0

set the z-index of the footer div to a higher value and it will slide over the top of other content on resize, and the other content will slide under it on navgation, something like

<style type='text/css'>
.footer { bottom:0; top:auto; width:100%; z-index:10; background:grey; position:fixed; }
ul { margin: 0; padding: .2em 1em; list-style-type: none; text-align:center; }
li { padding:.2em 1em; display:inline;}
li:hover {height:100px; background:blue;}/* & other effects already used for your expanding layers */
</style></head>
<body>
<div class='footer'>
<ul>
<li>Big</li>
<li>fat</li>
<li>hairy</li>
<li>deal</li>
</ul>
</div>
<div>content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
content<br /> content<br />
</div></body></html>

extraneous headers left out

Edited by almostbob: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.