具有不同寬度的

jquery的手風琴我想以下：具有不同寬度的

我的第一報頭（和相關聯的潘內爾）進一步向左然後所有其他pannels
所有手風琴元件的右邊緣應該是正當

jQuery的手風琴

+---------+ 
|header 1 | 
+---------+ 
| ... | 
|content1 | 
|   | 
+---------+ 
    +-------+ 
    |header2| 
    +-------+ 
    |header3| 
    +-------+ 
    | ... | 
    |cont.3 | 
    |  | 
    +-------+

我不知道它是否重要，但我動態添加手風琴（頁面已加載之後）。

編輯：

添加手風琴元素和更新後的工作手風琴。這基本上就是我所做的：

 var header = document.createElement("h3"); 
     $(header).css({"width": "350px","margin-left": "50px"}) 
     header.innerHTML = "Header Text"; 
     $("#accordion").append(header); 
     var div = document.createElement("div"); 
     $(div).css({"width": "350px","margin-left": "50px"}); 
     div.innerHTML = "Pannel Text"; 
     $("#accordion").append(div); 
     $("#accordion").accordion("refresh");

來源

2014-03-25 Hansi Zimmrer

我想你試過的代碼 – pbenard

我試圖自動訪問（通過jQuery）生成的css文件。但它不能正常工作（因爲我必須在添加另一個手風琴元素之後調用'$（「＃accordion」）。accordion（「refresh」）;'方法）。另一種解決方案可能是圍繞手風琴元素包裝一些div。如果你認爲，我沒有嘗試過去幾個小時的任何事情，你的錯誤路徑... –

這裏的東西，似乎是像你想：

小提琴：http://jsfiddle.net/CzVhk/

CSS [摘錄]：

#accordion a{ 
    margin-left:50px; 
} 
#accordion div{ 
    margin-left:50px; 
} 
#accordion a:first-child{ 
    margin-left:0px; 
} 
#accordion a:first-child + div{ 
    margin-left:0px; 
}

HTML：

<div id="accordion"> 
    <a href="#one" class="first">Recent Posts</a> 
    <div id="one"> 
     this is some info. 
    </div> 

    <a href="#two">Popular Posts</a> 
    <div id="two"> 
     this is some more info. 
    </div> 

    <a href="#three">Archived Posts</a> 
    <div id="three"> 
     this is even more info. 
    </div> 
    <a href="#four">Archived Posts</a> 
    <div id="four"> 
     this is even more info. 
    </div> 
</div>

來源

2014-03-25 13:13:56 pbenard

謝謝你！這是一個很好的！ –

具有不同寬度的

回答

相關問題