Skip to content
Collection of cssHooks that work with jQuery 1.4.3+
JavaScript CSS
Find file
Failed to load latest commit information.
tests Updated tests Aug 18, 2011
.gitattributes forcing line endings to be LF and ignoring some files Nov 2, 2010
.gitignore forcing line endings to be LF and ignoring some files Nov 2, 2010
LICENSE.txt Updated license and README Aug 18, 2011
README.md Update and rename README.markdown to README.md Oct 17, 2013
bgpos.js Separate hooks into individual files. Add support for setting margin,… Nov 1, 2010
border-radius.htc updated Border radius alternative Nov 10, 2010
borderimage.js Updated Border Image hook. Changed order when checking for support. Aug 18, 2011
borderradius.js adding a test to check single value and multiple value setting for bo… Nov 9, 2010
borderradiusalt.js Updated Border Radius Alt hook Aug 18, 2011
boxreflect.js Updated Box Reflect hook Aug 18, 2011
boxshadow.js Merging in pdokas/jquery-cssHooks Nov 11, 2010
boxsizing.js Updated Box Sizing hook Aug 18, 2011
color.js Now compatible with jQuery 1.5.1, please upgrade and report bugs Feb 17, 2011
columns.js Updated Columns hook Aug 18, 2011
gradients.js Update gradients.js Mar 7, 2013
marginpadding.js Separate hooks into individual files. Add support for setting margin,… Nov 1, 2010
skeleton.js Use double quotes Apr 21, 2011
textshadow.js Removing cssNumber property from values that shoudln't have it. Apr 21, 2011
transform.js Update skeleton.js and transform.js to enable better perf with jQuery… Apr 21, 2011
transition.js lowercasing style.transition and style.boxShadow per lrbabe's comment… Nov 6, 2010
userinterface.js Updated User Interface hook Aug 18, 2011

README.md

cssHooks

A collection of cssHooks that work with jQuery 1.4.3+.

Current Hooks:

  • margin and padding
  • backgroundPosition, backgroundPositionX, backgroundPositionY
  • borderRadius, borderRadiusTopLeft, borderRadiusTopRight, borderRadiusBottomRight, borderRadiusBottomLeft
  • boxShadow, boxShadowColor, boxShadowBlur, boxShadowSpread, boxShadowX, boxShadowY
  • borderImage
  • Alternative Border Radius Plugin with support for IE 6, 7, and 8
  • boxReflect
  • boxSizing
  • textShadow, and textShadowColor, textShadowX, textShadowY, and textShadowBlur
  • color animations for backgroundColor, borderBottomColor, borderLeftColor, borderRightColor, borderTopColor, borderColor, boxShadowColor, color, outlineColor, and textShadowColor
  • columnCount, columnSpan, columnGap, columnWidth, columnRuleColor, columnRuleStyle, columnRuleWidth
  • 2D transforms
  • linear and radial gradients

Usage

Super simple. Just request the margin, padding, backgroundPosition, boxShadow, etc like you would other CSS properties.

// #myElement { margin: 1px 2px 3px 4px; }
$('#myElement').css('margin'); // "1px 2px 3px 4px"

What about setting properties?

// #myElement { box-shadow: #000 1px 1px 3px; }
$('#myElement').css('boxShadow', '#ccc 5px 5px');
$('#myElement').css('boxShadowColor', '#ff5e99');
$('#myElement').css('boxShadowBlur', '0px');
$('#myElement').css('borderImage', 'url(image.jpg) 27 27 27 27 round round');

And even animating?!

$('#myElement').animate({ backgroundPositionY: 100 }, 500);

What are cssHooks?

jQuery 1.4.3 introduced the concept of cssHooks. They allow you to hook directly into jQuery and override how certain css properties are retrieved or set. This allows for browser normalization or even the creation of your own unique css properties.

License

The cssHooks plugin is licensed under the MIT License (LICENSE.txt).

Copyright (c) 2013 Brandon Aaron, Burin Asavesna, Tom Ellis, Phil Dokas and Louis-Rémi Babé.

Something went wrong with that request. Please try again.