cross-browser opacity mixin

public/stylesheets/sass/_mixins.scss

@@ -27,3 +27,10 @@
   background: -webkit-gradient(linear, 0% $start, 0% $end, from($from), to($to));
   background: -moz-linear-gradient(top, $from $start, $to $end);
 }
+
+@mixin opacity($val){
+  filter: alpha(opacity= $val* 100);
+  -moz-opacity: $val;
+  -khtml-opacity: $val;
+  opacity: $val;
+}

public/stylesheets/sass/application.sass

@@ -400,11 +400,11 @@ header
 
 
   .delete
-    :opacity 0.6
+    @include opacity(0.6)
     :padding 5px
 
     &:hover
-      :opacity 1
+      @include opacity(1)
 
 .time,
 .timeago
@@ -946,14 +946,14 @@ label
       :shadow 0 1px 0 #eee
 
     img
+      @include opacity(0.4)
+
       :display inline-block
       :margin 0
       :padding 0
       :margin
         :bottom -3px
 
-      :opacity 0.4
-
     &:hover
       :background
         :color #eee
@@ -961,16 +961,16 @@ label
 
       :color #666
       img
-        :opacity 0.6
+        @include opacity(0.6)
 
     &:active
       :text-shadow 0 1px 0 #fafafa
       :color #ccc
       img
-        :opacity 0.1
+        @include opacity(0.1)
 
     &.loading
-      :opacity 0.5
+      @include opacity(0.5)
 
 #publisher_textarea_wrapper
   :position relative
@@ -1035,7 +1035,7 @@ label
     :display inline
 
 .dim
-  :opacity 0.3
+  @include opacity(0.3)
 
 img.thumb_small
   :max-height 50px
@@ -2072,7 +2072,7 @@ h3,h4
   :top 3px
 
   &:hover
-    :opacity 0.5
+    @include opacity(0.5)
 
 #edit_aspect_trigger
   :font
@@ -2169,10 +2169,11 @@ h3,h4
 
   .stream_element
     .aspect_badges
-      :opacity 0.5
+      @include opacity(0.5)
+
     &:hover
       .aspect_badges
-        :opacity 1
+        @include opacity(1)
 
   .aspect_badge
     :position relative
@@ -2696,7 +2697,7 @@ div.dislikes
     :right 5px
 
 #contact_visibility_padlock:hover
-  :opacity 0.7
+  @include opacity(0.7)
 
 .side_stream
   .stream_element