allow for setting opacity of alpha image divs. also give both Icon and Marker setOpacity() functions. added tests and modified examples/markers.html to show how to do it.

git-svn-id: http://svn.openlayers.org/trunk/openlayers@1541 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

lib/OpenLayers/Icon.js

@@ -87,6 +87,16 @@ OpenLayers.Icon.prototype = {
         return this.imageDiv;
     }, 
 
+    
+    /** Change the icon's opacity
+     * @param {float} opacity
+     */
+    setOpacity: function(opacity) {
+        OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv, null, null, null, 
+                                            null, null, null, null, opacity);
+
+    },
+    
     /**
     * @param {OpenLayers.Pixel} px
     */

lib/OpenLayers/Marker.js

@@ -98,6 +98,15 @@ OpenLayers.Marker.prototype = {
         }        
     },
     
+    /** Change the opacity of the marker by changin the opacity of 
+     *   its icon
+     * 
+     * @param {float} opacity Specified as fraction (0.4, etc)
+     */
+    setOpacity: function(opacity) {
+        this.icon.setOpacity(opacity);
+    },
+
     /** Hide or show the icon
      * 
      * @param {Boolean} display

lib/OpenLayers/Util.js

@@ -169,9 +169,11 @@ OpenLayers.Util.alphaHack = function() {
 * @param {String} position
 * @param {String} border
 * @param {String} sizing 'crop', 'scale', or 'image'. Default is "scale"
+* @param {float} opacity Specified as fraction (0.4, etc)
 */ 
 OpenLayers.Util.modifyAlphaImageDiv = function(div, id, px, sz, imgURL, 
-                                               position, border, sizing) {
+                                               position, border, sizing, 
+                                               opacity) {
 
     OpenLayers.Util.modifyDOMElement(div, id, px, sz);
 
@@ -182,15 +184,25 @@ OpenLayers.Util.modifyAlphaImageDiv = function(div, id, px, sz, imgURL,
     }
     OpenLayers.Util.modifyDOMElement(img, div.id + "_innerImage", null, sz, 
                                      "relative", border);
-
+    if (opacity) {
+        div.style.opacity = opacity;
+        div.style.filter = 'alpha(opacity=' + (opacity * 100) + ')';
+    }
+    
     if (OpenLayers.Util.alphaHack()) {
+
         div.style.display = "inline-block";
         if (sizing == null) {
             sizing = "scale";
         }
+        
         div.style.filter = "progid:DXImageTransform.Microsoft" +
                            ".AlphaImageLoader(src='" + img.src + "', " +
                            "sizingMethod='" + sizing + "')";
+        if (div.style.opacity) {
+            div.style.filter += " alpha(opacity=" + div.style.opacity * 100 + ")";
+        }
+
         img.style.filter = "progid:DXImageTransform.Microsoft" +
                                 ".Alpha(opacity=0)";
     }