mootools_使用MooTools遮盖力

mootools

Although it's possible to achieve opacity using CSS, the hacks involved aren't pretty. If you're using the MooTools JavaScript library, opacity is as easy as using an element's "set" method. The following MooTools snippet takes every image with the "opacity" class and sets the element's opacity based upon the number in the image's rel tag. MooTools 1.2 is required.

尽管可以使用CSS来实现不透明性 ，但是涉及的hacks并不漂亮。 如果您使用的是MooTools JavaScript库，则不透明度就像使用元素的“设置”方法一样简单。 以下MooTools片段采用“ opacity”类获取每张图像，并根据图像的rel标签中的数字设置元素的不透明度。 MooTools 1.2是必需的。

View Demo 观看演示

MooTools JavaScript (The MooTools JavaScript)

/* on dom ready ... */
window.addEvent('domready', function() {
	/* for each image that requires opacity */
	$$('.opacity').each(function(el) {
		/* set the opacity based on the alt value */
		el.set('opacity','.' + el.get('rel'));
	});
});

XHTML (The XHTML)

<img src="rod.jpg" rel="80" class="opacity" />
<img src="rod.jpg" rel="60" class="opacity" />
<img src="rod.jpg" rel="40" class="opacity" />
<img src="rod.jpg" rel="20" class="opacity" /><br />

结果 (The Result)

View Demo 观看演示

翻译自: https://davidwalsh.name/mootools-opacity

mootools