Upwards animating Megavator
PVII is the leader in creative extensions for Dreamweaver.
This technique will show you how to:
Set up an Elevator/Megavator widget that glides upwards. This tweak requires the Megavator add-on for Elevator Panel Magic and uses the Megavator Mult-Color Style Theme, which has semi-transparent panels. Mouse options are set to use onmouseover and onmouseout and all panels are set to be closed on load.
The first style tweak sets a bottom position on the cwrapper element. Set it high enough to ensure that the panels can clear the height of the trigger links:
.p7EPM50 .p7epm_cwrapper {
border: 0;
width: 100%;
bottom: 54px;
}
We also adjusted the padding on the .p7EPM50 .p7epm_trigs a rule to 12px on all sides.
.p7EPM50 .p7epm_trigs a {
color: #000;
padding: 12px;
display: block;
text-decoration: none;
background-color: #FFF;
border: 1px solid #000;
}
On the .p7EPM50 .p7epm_trigs rule, we removed the padding-bottom and set padding-top to 10px:
.p7EPM50 .p7epm_trigs {
overflow: hidden;
border-left: 0;
font-size: 0.85em;
text-transform: uppercase;
background-image: url(img/epm_iefix.gif);
padding-top: 10px;
}
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque congue tristique eros. Nulla facilisi. Quisque sem mauris, ullamcorper ac, gravida id, mattis id, sapien. Nullam adipiscing enim dapibus felis. Fusce a nisi in odio pulvinar fringilla. Nunc blandit interdum metus. Duis leo nunc, sollicitudin ut, fermentum congue, pharetra eu, massa. Suspendisse potenti. Morbi commodo mauris. Ut at pede. Ut id nisi. Donec scelerisque urna quis ligula. Praesent est. Vestibulum scelerisque. Curabitur quam. Fusce rhoncus pellentesque ipsum. Aenean venenatis metus ac quam. Maecenas lacus lacus, sagittis vitae, congue at, euismod eu, urna. Maecenas vitae purus. Praesent eros lectus, porta et, semper nec.
Lorem ipsum dolor sit amed sed diam nonummy nibh euismod tincidunt ut. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, eu feugiat nulla at vero eros et accumsan et odio qui blandit praesent luptatum augue duis dolore te feugait nulla facilisi.
Lorem ipsum dolor sit amed sed diam nonummy nibh euismod tincidunt ut. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, eu feugiat nulla at vero eros et accumsan et odio qui blandit praesent luptatum augue duis dolore te feugait nulla facilisi.