How to do this in CSS?
How to do this in CSS?
Out of context: Reply #1
- Started
- Last post
- 6 Responses
- Nathan_Adams0
html:
<div class="container">
<img src="hi.jpg" width:300 height: 200" />
<span>Text for rollover</span>
</div>css:
.container {display:block; position: relative}
.container span {display:block; position:absolute; width: 100%; height: 100%; background: rgba(255,0,0,0.5); opacity: 0;}
.container:hover span {opacity: 1}That'll get you started. Through in some css transitions and some other styling to fancy it up a bit.
- oh, and .container span should also have top:0; left: 0;Nathan_Adams
- Thanks Nathan!mg33