You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
58 lines
1001 B
58 lines
1001 B
<style>
|
|
|
|
#container {
|
|
width: 850px;
|
|
margin: auto;
|
|
}
|
|
|
|
.back
|
|
{
|
|
position:absolute;
|
|
top:0;left:0;
|
|
}
|
|
.wrap
|
|
{
|
|
width:550px;
|
|
height:390px;
|
|
position:relative;
|
|
margin:auto;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.comment
|
|
{
|
|
position: absolute;
|
|
width: 550px;
|
|
height: auto;
|
|
top: 400px;
|
|
left: 0px;
|
|
letter-spacing: -1px;
|
|
color: white; font: 24px/45px Berlin Sans FB, Sans-Serif;
|
|
background: #4A4D4A;
|
|
padding: 10px;
|
|
filter:alpha(opacity=60);
|
|
-moz-opacity:0.6;
|
|
-khtml-opacity: 0.6;
|
|
opacity: 0.6;
|
|
line-height: 90%
|
|
}
|
|
|
|
</style>
|
|
|
|
<button onclick="overlay()">Click Me!</button>
|
|
|
|
<div class="wrap">
|
|
<img class="backer" src="../../Content/leopard.jpg" alt="image"/>
|
|
|
|
<span class="comment">
|
|
Loading...
|
|
</span>
|
|
</div>
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
function overlay() {
|
|
$('.wrap').children('.comment').stop().css("top", "0px");
|
|
}
|
|
</script> |