Аккордеон JQuery: открытый div врезается в контент (приведено справочное изображение)

Я займусь этим. Вот изображение того, о чем я говорю в заголовке: ошибка JQuery Accordion. Обратите внимание, как контур div обрывается с правой стороны, чтобы соответствовать содержимому того, что я выбрал. Я заблокировал содержимое div в Paint из соображений конфиденциальности, но вы поняли идею. Это происходит, когда у меня уже открыт другой элемент, и я пытаюсь открыть другой. Если все элементы закрыты, и я нажимаю, чтобы открыть элемент, он выглядит нормально (на самом деле, если вы внимательно посмотрите, он врезается, а затем очень быстро корректируется). Только когда один элемент уже открыт, а я нажимаю на другой, происходит этот глюк. Ниже приведен код, который я использую для настройки аккордеона:

$('#demo_accordion').accordion({
    header: "h3",
    active: false,
    autoHeight: false,
    collapsible: true
});

Обратите внимание, что для складного установлено значение true, поэтому я разрешаю открывать только один элемент за раз. Теперь вот HTML, который я использую (в сокращенной форме):

<div id="demo_accordion">
    <% foreach (var entry in Entries) %>
    <% { %>
            <div>
                <h3><a href="#"><%= entry.EntryDate %> - Testing</a></h3>
                <table>
                    <!-- table code here -->
                </table>
            </div>
    <% } %>
</div>

Я также использую встроенный .NET C#, внутри ‹% и %>. Не знаю, связано ли это с CSS или что-то в этом роде, но я уверен, что точно слежу за демонстрацией онлайн.

Любая помощь будет оценена по достоинству. Спасибо.


jquery accordion
person MegaMatt    schedule 02.02.2010    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Если вы посмотрите на документы, вы увидите форматирование html для аккордеона. То, что вам нужно, это что-то вроде этого, когда таблица находится в блочном элементе, таком как div, и этот div идет после заголовка. Наличие инкапсулирующего div вокруг каждой части аккордеона не требуется.

Формат должен быть:

<div id="demo_accordion">
   <% foreach (var entry in Entries) %>
   <% { %>
      <h3><a href="#"><%= entry.EntryDate %> - Testing</a></h3>
      <div> 
         <table>
            <!-- table code here -->
         </table>
      </div>
   <% } %>
</div>

Должно решить вашу проблему.

person munch    schedule 02.02.2010