title: Store CSS value in var based on a functions parameter and then manipulate it
body: <p>I have several elements that I want to manipulate on a '.hover' event via the CSS property 'max-width'. However all of them have different values, for example one is 25% and another is 60%, and I would prefer to create one function that takes in a given element, stores it's max-width value and then uses it in an animation later rather than create multiple functions or lines of code for all possible scenarios. Here is an example of what I mean with pseudocode</p>
  
  <pre><code>function Hover (element) {
      var maxwidth = $(element).css({'max-width': 'value'}); //something like this perhaps?
      $(element).hover(
          function () {
              $(this).animate({'max-width': maxwidth + 5%}, "slow"); //actually use the var in the css call
          },
          function () {
              $(this).animate({'max-width': maxwidth(original value)}, "slow"); //then restore the original value 
          }
      ); 
  }
  </code></pre>
  
  <p>Hopefully what i'm trying to do makes sense here. Any help would be appreciated.
  Thanks!</p>