這是一款可用於展示歷史和計畫的時間軸外掛程式，尤其比較適合一些**展示發展歷程、大事件等場景。該外掛程式基於jquery，可以滑動切換、水平和垂直滾動、支援鍵盤方向鍵。經過擴充套件後可以支援滑鼠滾輪事件。
檢視演示
html
我們在body中建立乙個div#timeline作為展示區，#dates為時間軸，示例中我們用年份作為主軸，#issues作為內容展示區，即展示對應主軸點年份的內容，注意id對應上。
id="timeline">
href="#" id="next">+
href="#" id="prev">-
接下來用css來布局，你可以設定不同的css來控制時間軸是否橫向排列還是縱向排列，根據需求自由發揮，以下給出的是縱向排列，即用於垂直滾動的樣式。
#timeline
#dates
#dates li
#dates a
#dates .selected
#issues
#issues li
#issues li h1
#issues li p
呼叫時間軸外掛程式非常簡單，執行以下**：
$(function());
});
選項描述
預設值orientation
時間軸方向，可為水平(horizontal)或垂直(vertical)
horizontal
containerdiv
時間軸展示主區域id
#timeline
datesdiv
時間軸主軸id
#dates
datesselectedclass
當前主軸軸點的樣式
selected
datesspeed
主軸滾動速度，可為100～1000之間的數字，或者設定為'slow', 'normal' or 'fast'
normal
issuesdiv
主要內容展示區
#issues
issuesspeed
對應內容區的滾動速度，可為100～1000之間的數字，或者設定為'slow', 'normal' or 'fast'
fast
issuestransparency
內容區的切入時的透明度，在0～1之間取值
0.2issuestransparencyspeed
內容區的切入時的透明度變化速度，100～1000之間的數字
500prevbutton
用於點選展示前一項內容的按鈕id
#prev
nextbutton
用於點選展示後一項內容的按鈕id
#next
arrowkeys
是否支援方向鍵，true or false
false
startat
初始化起點，即初始化軸點位置，數字
1autoplay
是否自動滾動，true or false
false
autoplaydirection
滾動方向，forward or backward
forward
autoplaypause
自動滾動時停留時間，毫秒
2000
支援滾輪驅動
此外，當前的jquery timelinr並不支援滑鼠滾輪驅動，其實我們可以稍微對外掛程式做下擴充套件就可以支援滑鼠滾輪驅動，這裡需要用到滾輪時間外掛程式：jquery.mousewheel.js
//--------------added by helloweba.com 20130326----------
if(settings.mousewheel=="true") else
});
}
然後在32行處加入初始化選項：
mousewheel: 'false'
$(function());
});
jquery垂直時間軸 外掛程式
提取碼 9fmc jquery時間軸 這是乙個簡單的響應時間軸交替的顏色標籤。乙個圖示字型用於在時間軸上的圖示的航點和 查詢一些例子說明如何調整的時間表較小的螢幕。時間軸的主要結構是乙個無序列表。使用步驟 html the css font face made with cbp tmtimeline...
使用canvas編寫時間軸外掛程式
這個外掛程式，原外掛程式中是使用原生的js 繪製dom節點來顯示時間軸，後面使用起來發現每一次重繪就要操作上百個dom節點，效能很差，所以決定採用canvas來重寫時間軸。1.繪製時間軸 上面包括刻度 錄影段 時間點 2.點選 拖動時間軸 可以返回釋放的時間點，控制台有列印值 3.放大縮小 在時間軸...
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...