Целевой элемент, загружаемый извне

Question

Я пытаюсь настроить таргетинг на элемент, который будет использоваться функцией ScrollReveal, элемент загружается из другого html-файла с именем "header.html". В настоящее время эффект ScrollReveal не возникает, но элементы в моем index.html делают это.

JS:

sr.reveal('nav', {
    origin: 'left',
    distance: '10rem',
    duration: 900,
});

Функция загрузки в моем HTML:

$(function() {
        $("#header").load("header.html");
        $("#footer").load("footer.html");
    });

nav находится внутри header.html

Answer 1

Используйте полный обратный вызов load (), чтобы убедиться, что новый контент загружен, прежде чем пытаться работать с ним

$(function() {
  $("#header").load("header.html", function() {
    // new html has been inserted
    // do what you want with it
    sr.reveal('nav', {
      origin: 'left',
      distance: '10rem',
      duration: 900,
    });
  });

  $("#footer").load("footer.html");
});