Аккордеон jQueryUI расширяется при загрузке

#html #css #jquery-ui

#HTML #css #jquery-пользовательский интерфейс

Вопрос:

У меня создан аккордеон, и когда я загружаю страницу, на секунду отображается все содержимое. После завершения загрузки страницы аккордеон сворачивается, как и предполагалось.

 <script>
  $(function() {
    $( "#accordion_rel" ).accordion({
      collapsible: true,
        active: false
      });
      });
</script>

<div id="accordion_rel">
  <h3>
    Related Articles
  </h3>
  <div>
    <ul class="side-expand">
      {% for cur in topic.articles %}
      <li>
        <a class="{% if article.id == cur.id %}active{% else %}inactive{% endif %}" href='{{ cur.public_url }}'>
          {{ cur.subject_plain | clip:35 }}
        </a>
      </li>
      {% endfor %}     
    </ul>
  </div>
</div>
  

Комментарии:

1. Где находится скрипт на странице?

2. в разделе заголовка

3. Затем он пытается запуститься до того, как Аккордеон был добавлен в DOM, так что, вероятно, он не будет работать должным образом. Что происходит, если вы ставите это в конце?

4. Проблема, похоже, связана со временем, потому что Граспер сказал, что поведение правильное, проблема только во время загрузки страницы, где элементы видны, я прав?

5. @Grasper, да, скрипт, который применяет свойства аккордеона, выполняется «слишком поздно». Но это его нормальное поведение, раньше у вас могли быть медленные процедуры… Может быть, вы можете попытаться скрыть свой div и показать его непосредственно перед или после accordion()

Ответ №1:

добавление встроенного стиля в первый div сделало свое дело!

    <div id="accordion_rel">
      <h3>
        Related Articles
      </h3>
      <div style="display:none">
  

Комментарии:

1. Отлично, рад вам помочь 😉

2. Спасибо, :-), пожалуйста, проголосуйте, чтобы я получил несколько баллов, потому что я не могу комментировать вопросы людей…