Vue之時間軸元件

實現思路及步驟：

頁面分為四個部分

1、左側時間

2、中間圓點

3、右側內容

4、虛線部分

最外層div,relative布局,方便子元素計算尺寸

左側時間固定寬度，顯示時間（本demo:100px）,之後absolute絕對定位（left:0）

中間圓點absolute絕對定位,因為左側寬度已經定為100px,圓點left值只需要大於100px肯定就會顯示在時間右側（具體值可以根據需求修改）

最右側的內容展示區域同理也是ab定位，值大於左側時間left值+圓點時間left值就可以（具體值可以根據需求修改）

最後只剩下虛線部分就可以得出結論，虛線的left值 = 圓點距離左側時間-圓點寬度的一半

此時，虛線正好壓在圓點中間部分，調整一下圓點和虛線的z-index值，即可

html**：}}

js**：
mounted() 
css**：
.time h2
.time-line
.time-line-div
.time-line-div>p:nth-child(1)
.time-line-div>p:nth-child(2)
.time-line-div>p:nth-child(3)
.img-dotted
.time-line-detail>p

vue 發展歷程時間軸動畫 Vue之時間軸元件

實現思路及步驟 頁面分為四個部分 1 左側時間 2 中間圓點 3 右側內容 4 虛線部分 最外層div,relative布局,方便子元素計算尺寸 左側時間固定寬度，顯示時間 本demo 100px 之後absolute絕對定位 left 0 中間圓點absolute絕對定位,因為左側寬度已經定為10...

仿uniapp 時間軸元件

現在自己所做的專案當中,所遇到的,和各個相關的元件都不太一樣,所以,在這裡,自己手寫了乙個時間軸 html部分 class history content class history content item v for item,id in historylist key id class his...

mysql 時間軸 使用MySQL計算時間軸的變化

我是mysql的新手,我需要你的幫助.我有一張包含類似資料的 robotposx robotposy robotposdir robotshortestpath 0.1 0.2 15 1456 0.2 0.3 30 1456 0.54 0.67 15 1456 0.68 0.98 22 1234 0...