Determines if the browser supports the functions in Fork's style library. Returns true of so and false otherwise. Support doesn't mean that the browser supports all possible style effects (eg. opacity) but it does mean that the JavaScript in this library will not error when one of these functions is called.
if (FORK.Style.isSupported()) {
FORK.Style.setOpacity('foo', 0.5);
} else {
alert('Your browser does not support the Fork Style library.');
}Sets the opacity of an element in browsers that support opacity setting. These browsers include IE 4, Netscape Navigator 6 and many newer browsers. Early versions of Safari are expected to work and if you have a version of Safari 1.1 please try to verify that it does. I have not been able to find this version of Safari and would like to test. Please email me if you can have access to Safari 1.1 and would like to run some tests (petermichaux@gmail.com).
Although all the new versions of the mainstream browsers (Internet Explorer, FireFox, Safari, Opera) support opacity it is still one of the most popular style effects that has the least likely support. Imagine your page running in a browser without opacity support. In some cases, if you set opacity to zero you may also want to set the visibility style to hidden. The mootools opacity setting function has this feature built in however it may not be a good idea in all cases.
Some early release versions of Firefox before version 1.5 had a problem when changing opacity from a value less than one to one. When the opacity value was changed to one the element would flicker off and then back on as it was redrawn. Somewhere in the bugzilla closed tickets about opacity there is discussion about this bug. If you are concerned about this flicker in these old versions of Firefox then when animating opacity animate up to a value of 0.9999 instead of 1. The Scriptaculous library has this feature built in but uses a browser sniff for implementation.
I have also read rumors that in some versions of past Mozilla-based browsers, if certain element have opacity set less than one it will not respond to mouse events. Workarounds involve tricks like surrounding the element with a div and attaching the listeners to that div. I haven't investigated or had to deal with this problem. read more.
FORK.Style.setOpacity('myDiv', 0.67);Sets the inline style of the element. If property is opacity then this function will call FORK.Style.setOpacity().
It is your choice if you want to use this function. It simply gives a way of setting opacity and other styles with a uniform API. This could be useful in developing an animation library. Also if you do use this function and a new browser bug or problem with a particular style appears in the future, the solution could be tucked inside this function and you wouldn't have to revisit any other code. This type of conservative thinking may be too paranoid however and lead to bulkier and less efficient code.
null for value because it is an invalid CSS property value.FORK.Style.setStyle('myDiv', 'width', '123px');FORK.Style.setStyle('myDiv', 'zIndex', 4);Reports the opacity setting of the element. The returned value could be undefined or a number in the range [0,1].
Browsers that are capable of setting opacity are not necessarily capable of reporting the opacity. Netscape Navigator 6.x browsers can set opacity but report back undefined for this function.
Generally browsers that cannot set opacity return a value of 1 for this function which is somewhat desirable as the element will be opaque. However Opera 7.5, 8.x and iCab 3.0.3 cannot set opacity and will return undefined for this function.
null for value because it is an invalid CSS property value.FORK.Style.setStyle('myDiv', 'width', '123px');This function provides a uniform API for determining the current style of a property. Computing the current style of particular property can be computationally expensive. In some cases, if you can avoid this function you may have faster code.
Property values with units like width could be reported differently depending on how they were set and potentially the browser doing the reporting. Also background-color is reported differently in different browsers. If the color is set to green then some browsers will return green others will return #008000 and others will return rgb(0, 128, 0) with potentially different spacing. If you use shorthand hex to specify the color like #00a then the browsers may also return a variety of different values including the shorthand version. This function does not normalize the values returned by various browsers for various CSS properties.
Some (older) browsers can only report values for a limited set of CSS property values. For example, Netscape Navigator 6.0 can report values for top, left, height, and width. For backgroundColor NN6 will only report "undefined".
If you call this function with property set to "opacity" then this function will call FORK.Style.getOpacity() and return the value returned by that function so it is a good idea to read the documentation for that function.
FORK.Style.getStyle('myDiv', 'width');FORK.Style.getStyle('myDiv', 'opacity');Note that for the Internet Explorer browsers, this library uses the Internet Explorer 4 opacity API filters:alpha(opacity=50) which is still supported Internet Explorer 7. So if you are defining opacity in a CSS file use this API. (The alternative is the much wordier Internet Explorer 5.5 API.)
The Yahoo! UI DOM collection and Scriptaculous contain the majority of ideas in this library.