Imagine being able to create web banners that couldn’t be blocked by most of the software designed to block such things out there currently? Piqued your interest? You can do it with a little simple CSS. Take a look. Quite creative really.
Newt: HTML codes:
CSS codes:
@media screen,projection{.banner,
.banner a{
/* dimensions of the banner */
width: 468px;
height: 60px;
display: block;
margin: auto; /* optionally, align the banner to the center */
}.banner a span{
display: none; /* hide the text */
}.banner{
/* display the non-animated banner image, by default */
background: transparent url("fox_banner.png") no-repeat;
color: inherit;
}.banner a:hover{
/* display the animated banner image, only when hovered */
background: transparent url("fox_banner.gif") no-repeat;
color: inherit;
}}
Tags: CSS