mootools_使用MooTools使用自定义丢失的图像图形

最新推荐文章于 2024-10-12 12:26:23 发布

culuo8053

最新推荐文章于 2024-10-12 12:26:23 发布

阅读量92

点赞数

文章标签： js python html5 计算机视觉 java ViewUI

原文链接：https://davidwalsh.name/custom-missing-image

版权

mootools

Missing images on your website can make you or your business look completely amateur. Unfortunately sometimes an image gets deleted or corrupted without your knowledge. You'd agree with me that IE's default "red x" icon looks awful, so why not use your own missing image graphic?

网站上丢失的图像可能会使您或您的业务看起来完全是业余的。不幸的是，有时图像会在您不知情的情况下被删除或损坏。您会同意我的观点，即IE的默认“红色x”图标看上去很糟糕，所以为什么不使用自己的缺失图像图形呢？

View Demo 观看演示

MooTools JavaScript (The MooTools JavaScript)


window.addEvent('domready',function() {
	/* version 1 */
	$$('img.missing1').addEvent('error',function() {
		this.set({
			src: 'https://davidwalsh.name/demo/missing-image.jpg',
			alt: 'Sorry!  This image is not available!',
			styles: {
				width: 110,
				height:40
			}
		});
	});
	/* version 2 */
	$$('img.missing2').addEvent('error',function() {
		this.set({
			src: 'https://davidwalsh.name/demo/missing-image-2.jpg',
			alt: 'Sorry!  This image is not available!',
			styles: {
				width: 30,
				height:28
			}
		});
	});
});

Note that I've provided two examples. If you want to get really specific, you can create multiple images and account for different sizes when possible.

请注意，我提供了两个示例。如果您想变得非常具体，则可以创建多个图像并在可能的情况下考虑不同的大小。

View Demo 观看演示

A great website accounts for all of the details. This is yet another way of accounting for the finest of details. A website is NEVER complete!

一个很棒的网站负责所有细节。这是解释细节的另一种方式。网站永远不完整！