css中关于层叠上下文的相关问题

求教：以下代码想实现让一个png格式的小圆点层叠显示在div+css画的长条矩形上，但是加载完页面后没有看到圆点。求教以下代码有什么问题？

<div id="time_move">
    <img src="./assets/icons/dot.png" id="process_img"></img>
</div>

---

#time_move{
    width:500px;
    height:8px;
    background-color:gray;
    border: 1px solid #777;
    border-radius: 5px;
    display:inline-block;    
    vertical-align:middle;
}

#process_img{
    position:relative;
    top:10%;
    left:1%;
    z-index:1;
}

---

贴一下效果截图出来看看，单纯这样看不出你的bug。

另外，你的dot的宽高是多少？

在我这边，这段代码的效果是能正常显示的。

---

发现不是上面代码的问题，而是引入的JS代码中的问题。