staaky (owner)

Revisions

gist: 17204 Download_button fork
public
Description:
Cross browser way to set a PNG background image on an element using Prototype.
Public Clone URL: git://gist.github.com/17204.git
Embed All Files: show embed
JavaScript #
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
Element.addMethods({
  setPngBackground: (function() {
    var IEBelow7 = (function(agent) {
      var version = new RegExp('MSIE ([\\d.]+)').exec(agent);
      return version ? parseFloat(version[1]) < 7 : false;
    })(navigator.userAgent);
 
    return function(element, url) {
      element = $(element);
      var options = Object.extend({
        align: 'top left',
        repeat: 'no-repeat',
        sizingMethod: 'scale',
        backgroundColor: ''
      }, arguments[2] || {});
 
      element.setStyle(IEBelow7 ? {
        filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + url + '\'\', sizingMethod=\'' +
          options.sizingMethod + '\')'
        } : {
        background: options.backgroundColor + ' url(' + url + ') ' + options.align + ' ' + options.repeat
      });
      return element;
    }
  })()
});