2009年3月19日

css高亮選單

話說坎尼看到 這篇 所介紹的
利用 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

沒有留言:

Google Spreadsheet 裡用規則運算式

最近因為工作關係,遇到要用 Google Form 及 Google Sheet 所以研究了 Google Sheet 裡的一些 function 怎麼用 首先,分享一下如何在 Google Sheet 裡用規則運算 :D