Cross Browser CSS sprites (for hovers, clicks, active state change via background position change)


/ Published in: jQuery
Save to your folder(s)

Creating sprite buttons often had problems with different browsers.
This is a solution to get background positions in each browser for further manipulation.


Copy this code and paste it in your HTML
  1. function getBgPos(oObj) {
  2. var aPosXY = false;
  3.  
  4. try {
  5. aPosXY = oObj.css('background-position').replace(/px/g, '').split(' ');
  6. aPosXY[0] = parseInt(aPosXY[0]);
  7. aPosXY[1] = parseInt(aPosXY[1]);
  8. } catch(error) {
  9. var aPosX = oObj.css("background-position-x").split('px');
  10. var aPosY = oObj.css("background-position-y").split('px');
  11. aPosXY = new Array(parseInt(aPosX[0]), parseInt(aPosY[0]));
  12. }
  13. return aPosXY;
  14. }

URL: http://blog.appstack.io

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.