Skip to content

Instantly share code, notes, and snippets.

@stuffmc

stuffmc/gist:741295

Created December 14, 2010 23:07
Show Gist options
  • Save stuffmc/741295 to your computer and use it in GitHub Desktop.
Save stuffmc/741295 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.txt
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.radio { text-align: center; height:125px; float:left; overflow:hidden; }
/* Why o why does this overflow gives me a non transparent background?
If you remove the overflow then you'll see it's not as nice */
.radio.show { -webkit-animation-name: slide; -webkit-animation-duration: 1s; width: 70px; }
@-webkit-keyframes slide { from { width: 0px;} to { width: 70px; } }
.logo { float:left; width:90px; height:90px; background:no-repeat; }
.rfm { background-image:url(http://radiopodcast.fr/system/radios/9_rfm_thumb.png); }
.europe1 { background-image:url(http://radiopodcast.fr/system/radios/3_europe1_thumb.png); }
</style>
</head>
<body>
<div class="radio show">
<div class="logo rfm">
<div class="speaker"></div>
</div>
RFM 11111111111111111
</div>
<div class="radio show">
<div class="logo europe1">
<div class="speaker"></div>
</div>
EUROPE 1 BBBBBBBBBBBBBBBB
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment