Wednesday, October 3

Animate web buttons (zoom in zoom out)

Exactly not an animation. Use this javascript code to zoom in zoom out buttons on mouse hover.

--- Below is Javascript code ---



function buttonZoom(id){
      var x = Number(document.getElementById(id).width);
      for(var i=x; i<=Number(x+20); i++){
            document.getElementById(id).width = Number(i);
      }
    }
   
    function buttonZoomOut(id){
      var x = Number(document.getElementById(id).width);
      for(var i=x; i>=Number(x-20); i--){
            document.getElementById(id).width = Number(i);
      }
    }


----- Below is JSP Code ---

<embed id="button" type="image/svg+xml" src="" onclick="as();"
onmouseover="buttonZoom(this.id);" onmouseout="buttonZoomOut(this.id);" width="60"/>

Note: Specifying width in jsp embed tag is necessary

No comments:

Post a Comment