Dreamweaver虚拟在线试衣室


  
  首先让我们来看看制作的效果图:点击此处欣赏示例

  下面来看看制作步骤:

  1.新建四个层,放入相应图片,模特层的z-index值设为0。

   


  2.把第一个层移到模特身上,找出衣服刚好穿上时层的top和left值,记下来,然后再把第一个层移回原来的地方。

   


  3.选用draglayer事件,并做相应的设置,如图所示,其中top和left的值就是第二步记下的值,snap if within的值可以按照个人喜好设定,值越大,衣服越容易放置,一般可设为50或100.第一件衣服设置完毕。

   

   


  4.仿照第一件衣服完成其他两件的设置,区别只在于选的层不同。

   


  5.把三件衣服draglayer的鼠标事件都选为onload.

       

  好了,完工,预览一下吧,是不是很有趣:)

【责任编辑:星河 频道主编:赵家雄