CSS"逼真"阴影(光源)

10 jquery effects light css3

看看下面的图片:

摩天大楼

蓝色框是div.现在我要做的是实现一种2.5D功能:

我希望灰色阴影有点像3D-ish.起初我想把盒子阴影值分配给"Y"轴,如下所示:

"box-shadow: -5px -5px 10px" + value.tallness +  "#888"
Run Code Online (Sandbox Code Playgroud)

但结果是上面的图像.

关于如何仅在一侧制作阴影的任何想法,就像有来自某个地方的光源一样?

EXTRA - 移动的 "光源"怎么样?

Cri*_*sty 20

你去:http://jsfiddle.net/KaCDN/15/

拖动光源以影响阴影.

更高的块:

  • 有较大的顶部,左边框
  • 进一步投下阴影
  • 他们的阴影更加模糊