Css Transition
Any help please. this is the first time i have done a css transition, this is my website deejaydiamond.bugs3.com/
and im trying to do this.
creating-css-transitions-in-dreamweaver-cs6/
html
<div id="webDesign">
<div class="contentinformation" id="contentinformation">
<h2>Cheap Website Design</h2>
<p>Cheap web design from £89.99 for 1 page</p>
</div>
<br />
</div>
Css
#webDesign {
background-image : url(../images/web-design.jpg);
background-repeat : no-repeat;
float : left;
height : 143px;
width : 220px;
overflow : hidden;
}
.contentinformation {
background-color: #000;
color: #FFF;
margin-top: 100px;
text-align: center;
font-weight: bold;
padding-top: 1px;
opacity:0.8;
filter:alpha(opacity=80); /* For IE8 and earlier */
-webkit-transition-property: top, bottom;
-webkit-transition-duration: 0.5s;
}
.contentinformation:hover {
top:0px;
bottom:0px;
}
Thanks for any help
Daniel