自定义产品照片

时间:2016-04-16 23:41:41

标签: javascript php jquery html css

所以我正在开发一个客户提供自定义交易卡的项目。我遇到的问题是能够以允许用户上传特定框中显示的照片的方式覆盖卡片模板。

我尝试了iframe方法,我尝试过使用2个div并使用z-index覆盖,我已经购买了2个产品定制器选项,但都没有完成我想要做的事情。

这是我需要的一个非常基本的图像:

Concept Example Photo

1 个答案:

答案 0 :(得分:0)

例如,简单的代码

JSFIDLE

现在,如果您可以发布完整的代码,我们可以为您提供进一步的帮助。

<div class="one">
Template area
</div>
<div class="two">
Template area
</div>
<div class="three">
Template area
</div>

CSS:
.one{
  position:relative
  width:100%;
  height:100px;
  background:url('http://pokit.org/get/img/20c0eb36b19b3006b310f5834a9f818f.jpg') NO-REPEAT;
}

.two{
  width:250px;
  height:50px;
  background-color:blue;
  position:absolute;

}
.three{
  margin-top:20px;
  position:relative;
  width:100%;
  height:100px;
  background:url('http://pokit.org/get/img/b90d68274639145e23102320e602afaa.jpg') no-repeat;
}