advanced code snippet search

Posted By

Sonberg on 12/03/09


Tagged

css menu html navigation Blur


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

Sonberg


Sonberg

 / Published in: CSS
 

URL: http://www.woobzine.com/files/demos/menublurpadding/index.php

Expand | Embed | Plain Text 
  1. <style>
  2. ul.blur-menu {
  3. background: #000;
  4. float: right;
  5. list-style-type: none;
  6. }
  7.  
  8. ul.blur-menu:hover li {
  9. margin-top: -100px;
  10. padding-bottom: 100px;
  11. text-shadow: 0 100px 3px #fff;
  12. }
  13.  
  14. ul.blur-menu:hover li:hover {
  15. color: #fff;
  16. text-shadow: 0 0 1px #fff;
  17. margin-top: 0px;
  18. padding-bottom: 0px;
  19. }
  20.  
  21. ul.blur-menu li {
  22. float: left;
  23. margin: 0;
  24. padding: 0 0 0 20px;
  25. text-shadow: 0 0 10px #000;
  26. }
  27.  
  28. ul.blur-menu li a {
  29. color: #fff;
  30. text-decoration: none;
  31. }
  32. </style>
  33.  
  34. <ul class="blur-menu">
  35. <li><a href="#" title="">Index</a></li>
  36. <li><a href="#" title="">Lyrics</a></li>
  37. <li><a href="#" title="">Dreams</a></li>
  38. <li><a href="#" title="">Feathers</a></li>
  39. <li><a href="#" title="">Beyond</a></li>
  40. <ul>

Report this snippet  

You need to login to post a comment.