Jquery 克隆图像更改固定div位置

当用户单击旋转木马中的图像时，我正在创建一个弹出的较大图像。我已经做到了这一点，但图像位置会根据其在旋转木马中的位置而变化。我现在的CSS是：

#carousel1{
    width:1000px;
    height:200px;
    overflow:scroll;
}
#popUp{ 
    display: none;
    position: fixed !important;
    width: 580px !important;
    height: 350px !important;
    z-index: 9999;
}

相关的HTML是：

<div id = "carousel1">
    <img class="cloudcarousel" src="1.png" alt="1" title="Flag 1 Title" />
    <img class="cloudcarousel" src="2.png" alt="2" title="Flag 2 Title" />
    <img class="cloudcarousel" src="3.png" alt="3" title="Flag 3 Title" />
    <img class="cloudcarousel" src="4.png" alt="4" title="Flag 4 Title" />
    <img class="cloudcarousel" src="5.png" alt="5" title="Flag 5 Title" />
</div>
<div id = "popUp"></div>

有关该问题的工作示例，请参阅：www.bingetech.com/carousel

---

是否有可能用克隆的图像将弹出的div放在屏幕中间？

，我认为它与.cONE（）方法有关。您可以确保只设置弹出图像属性，因为克隆图像将导致与克隆目标接触相同的值

#popUp img {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -175px;
  margin-left: -290px;
}

---

注意：确保这是在css中的.cloudcarousel类下面声明的

是否需要将当前的主徽标图像替换为用户将在旋转木马中单击的图像

---

你能详细说明放大图像的位置吗。或者是所需内容的快照？

希望您注意我的编辑，下次只在问题中输入与答案相关的内容。无用的PHP行或其他东西只会给代码添加噪音，使其难以理解。记住！：）Happy编写了代码，仍然没有把图像放在中心。。。我还认为可能是clone（）方法，但仍然不确定该方法是否位于页面的正中央，注意图像如何在不同位置弹出。试试这个。将popup div放置在转盘div.之前，并将popup的样式更改为“位置：相对”；边距：0px自动”，并将弹出块的高度降低到图像高度，即200px

#popUp img {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -175px;
  margin-left: -290px;
}