2012-02-08 86 views
0

我正在使用導航按鈕的Navigator插件的jQuery工具可滾動插件。設置導航按鈕

一切都很好,它只是一個定位問題。

現在我有給我們導航按鈕絕對定位:

.navi { 
    width: auto; 
    height:13px; 
    position: absolute; 
    right: 35px; 
    top: 10px; 
} 

.navi a { 
    width:8px; 
    height:8px; 
    float:right; 
    margin:3px; 
    background: url(../img/navigator.png) 0 0 no-repeat; 
    display:block; 
    font-size:1px; 
    cursor: pointer; 
} 

我需要有錨浮動權,因爲他們將動態增長,並在設計中的右邊緣對齊和成長走到左邊。

問題在於,該插件將使錨點位於第一個最右側。我需要左側的第一個錨點作爲第一個錨點並重復右側。

目前的HTML看起來像這樣

<div class="navi"> 
    <a></a> 
    <a></a> 
    <a class="active"></a> 
</div> 

與他們的浮動權。

我需要他們浮動權,但呈現這樣的:

<div class="navi"> 
    <a class="active"></a> 
    <a></a> 
    <a></a> 
</div> 

我使用這個插件Jquery Tools Navigator

回答

0

float:right;的默認功能是顯示最右邊的第一個元素,以下元素將從右到左排列。如果你希望它們從左到右顯示,你將不得不使用float: left;。如果左側浮動不適合你,你將不得不重新排列圖像的順序。

0

這只是一個CSS問題 - 沒有什麼用jQuery做的,肯定不是C#'浮動'標籤!

我認爲這張圖片'navigator.png'是20x20px,所以你必須在.navi上使用塊元素才能設置大小。在這種情況下,您必須在.navi a上使用float:left,然後將.navi width:auto更改爲指定大小(3個標籤= 3 x(8 + 6)= 42 - 這就是寬度+邊距) 。然後,您可以使用.navi文本縮進:-9999px在標籤中輸入一些文本。

另一種方法是使用一些填充來修改它。就我個人而言,我會使用第一種解決方案。讓我知道你是否需要澄清CSS代碼。