Tag: khtml

CSS -moz-opacity, -ms-filter, -khtml-opacity

I recently stumbled upon the use of this CSS element in some older code and document it here for future reference.

  • Gecko 1.9.1 (Firefox 3.5 – final release of June 30, 2009) and later do not support -moz-opacity. By now, you should be using simply opacity.
  • Prior to version 9, Internet Explorer does not support opacity, rather it supports filter instead.
  • IE supports also the extended form progid:DXImageTransform.Microsoft.Alpha(Opacity=xx).
  • IE8 introduced -ms-filter, which is synonymous with filter.
  • Similar to -moz-opacity, -khtml-opacity has been dead since early 2004 (release of Safari 1.2).
    Konqueror never had support for -khtml-opacity and had been supporting opacity since version 4.0.

REFERENCES:

Making HTML text unselectable with CSS

There are often circumstances where you do not want users to select certain text on your page in order to maintain a facade… rounded buttons for example.

In most browsers, this can be achieved using CSS (much of it proprietary below), For IE and Opera, you will need to use the unselectable expando property of the element you wish to be unselectable.

You can set this using an attribute in HTML:
<div id="foo" unselectable="on" class="unselectable">...</div>
<style type="text/css">
.unselectable {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
</style>

Sadly this property isn’t inherited, meaning you have to put an attribute in the start tag of every element inside the

. If this is a problem, you could instead use JavaScript to do this recursively for an element’s descendants:

function makeUnselectable(node) {
if (node.nodeType == 1) {
node.unselectable = true;
}
var child = node.firstChild;
while (child) {
makeUnselectable(child);
child = child.nextSibling;
}
}
makeUnselectable(document.getElementById("foo"));

REFERENCES: