DeviantArt是如何在他们的图像中实现阴影的？

Question

我只是想知道DeviantArt.com如何在每张图片上实现阴影。

如果你看一下缩略图，你会发现图像有点阴影。我认为他们是用Javascript完成的，因为当我关闭我的Javascript时，阴影消失了。他们也在使用jQuery btw。

Answer 1

我相信它在服务器端。

如果您看到：http://sh.deviantart.com/x/170/100/logo3.png

您可以更改“变量”以适合您的尺寸。

然后我猜它只是图像上的背景属性，带有一些填充以将图像放在中心。

Answer 2

他们的javascript被混淆了所以很难跟踪正在发生的事情。如果你检查他们的图像，你可以看到他们用一个名为“shadow”的类的跨度封装，它有一个像这样的背景图像样式：

<span style="background-image: url(http://sh.deviantart.com/x/150/134/logo3.png);" class="shadow">

---

但是，如果您正在寻找一种向图像添加阴影的客户端方式，请查看此脚本：http://www.netzgesta.de/corner/

Answer 3

使用FireBug检查thumnail，您会看到缩略图位于span元素中，其中style =“background-image：url（http://sh.deviantart.com/x/150/100/logo3.png）;”

所以基本上有一个模仿阴影的图像背景。