Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

Untitled

By: a guest on Aug 12th, 2012  |  syntax: None  |  size: 1.05 KB  |  hits: 12  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. SVG set attribute fill not working
  2. <set attributeName="fill" to="#AEAEAE" begin="button.mouseover" end="button.mouseout"/>
  3.        
  4. <div id="button">show svg onhover
  5.      <svg id="play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" width="42px" height="62px" viewBox="0 0 24 32" style="enable-background:new 0 0 24 32;" xml:space="preserve" xmlns:xml="http://www.w3.org/XML/1998/namespace">
  6.     <g id="Layer_1">
  7.     </g>
  8.     <g id="play">
  9.       <polygon points="0,0 24,16 0,32  "/>      
  10.     </g>
  11.    </svg>
  12.   </div>
  13.        
  14. #button {
  15.  
  16. height: 75px;
  17. width: 275px;
  18. font-size: 25px;
  19. text-align: center;
  20. background: #FF702A;
  21. border-radius: 10px;
  22. padding-top: 40px;
  23. margin-top: 70px;
  24. margin-left: 150px;
  25. opacity: 0.7;
  26. letter-spacing: 1px;
  27. font-variant: small-caps;
  28. color: #EEEEEE;
  29.        
  30. #button:hover {
  31. opacity: 1.0;
  32. font-size: .01em;
  33.        
  34. #play{
  35. position: absolute;
  36. margin-left: -90px;
  37. margin-top: -10px;
  38. visibility: hidden;
  39.        
  40. #play:hover {
  41. visibility: visible;
  42.        
  43. #button { fill: #FF702A; }
  44. #button:hover { fill: #AEAEAE; }
create a new version of this paste RAW Paste Data