創建一個列表項目（javascript）

我有一個項目列表中有一個背景圖像（通過CSS）和一些文本。簡單的標記如下：創建一個列表項目（javascript）

<ul> 
    <li>List item 1</li> 
    <li>List item 2</li> 
    <li>List item 3</li> 
    etc... 
</ul>

試想一下，每個列表項目是一個正方形。有沒有簡單的方法將它們顯示爲半圓形？即

[][] 
[] [] 
[]  []

我們使這個稍微複雜一些，有個變量 - 列表項的數量是未知的，所以我需要工作，這一點對飛。我可以很容易地計算出每個列表項的寬度，以便它在x-xis上看起來正確，但我只是在y軸上遇到問題。

任何幫助感激地接受。

感謝您的時間嗅探器

來源

2010-07-21 Sniffer

我不知道你的意思開心的臉，悲傷的面孔是什麼，我們可以看到，你有什麼？ – 2010-07-21 07:50:57

'：o）'vs.'：o（'，我想，但你需要一個草圖或其他什麼東西 – Kobi 2010-07-21 07:52:24

我的意思是在'n'而不是'u'中是半圓形，這有幫助嗎？ – Sniffer 2010-07-21 07:58:11

你的弓被分爲item_count-1片，一個完整的圓是2PI弧度，您只使用一個半圓（1PI）。將總數（1Pi）除以切片數（item_count）並將其中的Sin乘以拱的高度。

在Javascript：

for(var i=0; i<item_count; i++){ 
    var angle=Math.PI/(item_count - 1), 
     y=(1-Math.sin(angle * i))*arch_height; 
    //set the items CSS 'top' property to y 
}

來源

2010-07-21 08:33:39

喜歡它！太感謝了。 – Sniffer 2010-07-21 09:05:16

創建一個列表項目（javascript）

回答

相關問題