利用 border style 來創造有角度的物件
於是想說可不可以套到用目前已經做好的高亮語法中 (或是光棒)
先講一下坎尼的設計流程
主要是利用 mouseover 及 mouseout 兩個事件
使背景改變達成 highlight 效果，再利用顯示及隱藏當箭頭的 div 物件
首先在畫面上加入 Table
接著把核心的箭頭樣式加入
另外再對 Table 裡的物件做 style 的設計
接下來是省 code 一哥 jQuery
先設定奇偶數的表格列樣式
再利用 jQuery 的 each 方法，對每個列裡的物件做操作
code 的部分坎尼就不多講了，上面都有註釋
當然不懂 jQuery 的看倌們先上 官網 充一下電吧
未來坎尼文章裡的 javascript 部分可能都會漸漸走向 jQuery 化
這篇的說明很少，圖也很少，不過卻有少見的 demo網頁
這個功能坎尼還有另一個想作的東西
但這一切就留待下一篇吧 (要先等坎尼研究出來 XD
補充一下...這些code是可以運用於 Gridview (當然要做點小修改就是
有興趣的人可以複製 demo 網頁裡的 source 回去研究 ^^
參考資料 Using borders to produce angled shapes
沒有留言:
張貼留言