Search code examples
javascriptiframeoffset

How can I modify my javascript to scroll less by 60px


I have an iFrame using some js to enable scrolling within an Advanced iFrame that auto resizes the frame.

My issue is that while the code below works well, it scrolls too far. It doesn't take account for my menu bar which is 60px high.

Issue can be seen here https://www.rosentreter.website/family-tree/ after selecting an alphabet letter.

How can I modify the code top.offset to reduce it by 60px? I've tried everything...

Using the library jquery-1.7.2.min, my code is as follows:

$(function() {var iframeOffset = $("#gramps", window.parent.document).offset();
  $("a").each(function () {
    var link = $(this);
    var href = link.attr("href");
    if (href && href[0] == "#") {
      var name = href.substring(1)
      $(this).click(function () {
          var nameElement = $("[name='" + name + "']");
          var idElement = $("#" + name);
          var element = null;
          if (nameElement.length > 0) {
             element = nameElement;
          } else if (idElement.length > 0) {
             element = idElement;
          }
           if (element) {
             var offset = element.offset();
              window.parent.scrollTo(offset.left, offset.top + iframeOffset.top);
           }
           return false;
       });
      }
   });
});

Solution

  • whan I changed this part of code your pace works pretty well

    window.parent.scrollTo(offset.left, offset.top + iframeOffset.top-60);
    


    full code

    $(function() {var iframeOffset = $("#gramps", window.parent.document).offset();
      $("a").each(function () {
          var link = $(this);
          var href = link.attr("href");
          if (href && href[0] == "#") {
              var name = href.substring(1);
              $(this).click(function () {
                  var nameElement = $("[name='" + name + "']");
                  var idElement = $("#" + name);
                  var element = null;
                  if (nameElement.length > 0) {
                      element = nameElement;
                  } else if (idElement.length > 0) {
                      element = idElement;
                  }
                   if (element) {
                      var offset = element.offset();
                      window.parent.scrollTo(offset.left, offset.top + iframeOffset.top-60);//Changed!!
                  }
                   return false;
              });
          }
      });
    });