定义一个完整的css hook

定义一个完整的css hook
  Defining a complete css hook(定义一个完整的css hook)
  
  要定义一个完整的cssHook,首先我们需要测试您当前使用的 jQuery 版本是否支持 cssHooks 方法,此外,还要结合上面提到的例子:
  
  (function($) {
  
  if ( !$.cssHooks ) {
  
  throw("jQuery 1.4.3+ is needed for this plugin to work");
  
  return;
  
  }
  
  function styleSupport( prop ) {
  
  var vendorProp, supportedProp,
  
  capProp = prop.charAt(0).toUpperCase() + prop.slice(1),
  
  prefixes = [ "Moz", "Webkit", "O", "ms" ],
  
  div = document.createElement( "div" );
  
  if ( prop in div.style ) {
  
  supportedProp = prop;
  
  } else {
  
  for ( var i = 0; i < prefixes.length; i++ ) {
  
  vendorProp = prefixes[i] + capProp;
  
  if ( vendorProp in div.style ) {
  
  supportedProp = vendorProp;
  
  break;
  
  }
  
  }
  
  }
  
  div = null;
  
  $.support[ prop ] = supportedProp
  
  return supportedProp;
  
  }
  
  var borderRadius = styleSupport( "borderRadius" );
  
  // Set cssHooks only for browsers that
  
  // support a vendor-prefixed border radius
  
  if ( borderRadius && borderRadius !== "borderRadius" ) {
  
  $.cssHooks.borderRadius = {
  
  get: function( elem, computed, extra ) {
  
  return $.css( elem, borderRadius );
  
  },
  
  set: function( elem, value) {
  
  elem.style[ borderRadius ] = value;
  
  }
  
  };
  
  }
  
  })(jQuery);
  
  然后,您可以在支持的浏览器中使用DOM(驼峰)样式或CSS(连字符号)的风格设置边框半径:
  
  $("#element").css("borderRadius", "10px");
  
  $("#another").css("border-radius", "20px");

推荐阅读