Skip to content

Instantly share code, notes, and snippets.

@af

af/debug-scroll.md

Forked from cuth/debug-scroll.md
Created February 8, 2023 19:50
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save af/16a252bf541df8621356dbc19cbb4fc4 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save af/16a252bf541df8621356dbc19cbb4fc4 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @cuth cuth revised this gist Jul 11, 2014. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -3,12 +3,12 @@
    ```js
    (function (d) {
    var w = d.documentElement.offsetWidth,
    t = d.createTreeWalker(d.body,NodeFilter.SHOW_ELEMENT),
    t = d.createTreeWalker(d.body, NodeFilter.SHOW_ELEMENT),
    b;
    while (t.nextNode()) {
    b = t.currentNode.getBoundingClientRect();
    if (b.right > w || b.left < 0) {
    t.currentNode.style.setProperty('outline','1px dotted red','important');
    t.currentNode.style.setProperty('outline', '1px dotted red', 'important');
    console.log(t.currentNode);
    }
    };
  2. @cuth cuth revised this gist Jul 10, 2014. 1 changed file with 5 additions and 3 deletions.
    8 changes: 5 additions & 3 deletions debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -3,9 +3,11 @@
    ```js
    (function (d) {
    var w = d.documentElement.offsetWidth,
    t = d.createTreeWalker(d.body);
    t = d.createTreeWalker(d.body,NodeFilter.SHOW_ELEMENT),
    b;
    while (t.nextNode()) {
    if (t.currentNode.offsetWidth > w) {
    b = t.currentNode.getBoundingClientRect();
    if (b.right > w || b.left < 0) {
    t.currentNode.style.setProperty('outline','1px dotted red','important');
    console.log(t.currentNode);
    }
    @@ -16,5 +18,5 @@
    Bookmarklet

    ```
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){t.currentNode.style.setProperty('outline','1px dotted red','important');console.log(t.currentNode);}};}(document));
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body,NodeFilter.SHOW_ELEMENT),b;while(t.nextNode()){b=t.currentNode.getBoundingClientRect();if(b.right>w||b.left<0){t.currentNode.style.setProperty('outline','1px dotted red','important');console.log(t.currentNode);}};}(document));
    ```
  3. @cuth cuth revised this gist Jul 9, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -4,7 +4,7 @@
    (function (d) {
    var w = d.documentElement.offsetWidth,
    t = d.createTreeWalker(d.body);
    while(t.nextNode()) {
    while (t.nextNode()) {
    if (t.currentNode.offsetWidth > w) {
    t.currentNode.style.setProperty('outline','1px dotted red','important');
    console.log(t.currentNode);
  4. @cuth cuth revised this gist Jul 9, 2014. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -6,7 +6,7 @@
    t = d.createTreeWalker(d.body);
    while(t.nextNode()) {
    if (t.currentNode.offsetWidth > w) {
    t.currentNode.style.outline = '1px dotted red !important';
    t.currentNode.style.setProperty('outline','1px dotted red','important');
    console.log(t.currentNode);
    }
    };
    @@ -16,5 +16,5 @@
    Bookmarklet

    ```
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){t.currentNode.style.outline='1px dotted red !important';console.log(t.currentNode);}};}(document));
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){t.currentNode.style.setProperty('outline','1px dotted red','important');console.log(t.currentNode);}};}(document));
    ```
  5. @cuth cuth revised this gist Jul 9, 2014. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -6,7 +6,7 @@
    t = d.createTreeWalker(d.body);
    while(t.nextNode()) {
    if (t.currentNode.offsetWidth > w) {
    t.currentNode.style.outline = '1px dotted red';
    t.currentNode.style.outline = '1px dotted red !important';
    console.log(t.currentNode);
    }
    };
    @@ -16,5 +16,5 @@
    Bookmarklet

    ```
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){t.currentNode.style.outline='1px dotted red';console.log(t.currentNode);}};}(document));
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){t.currentNode.style.outline='1px dotted red !important';console.log(t.currentNode);}};}(document));
    ```
  6. @cuth cuth revised this gist Jul 9, 2014. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -6,6 +6,7 @@
    t = d.createTreeWalker(d.body);
    while(t.nextNode()) {
    if (t.currentNode.offsetWidth > w) {
    t.currentNode.style.outline = '1px dotted red';
    console.log(t.currentNode);
    }
    };
    @@ -15,5 +16,5 @@
    Bookmarklet

    ```
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){console.log(t.currentNode);}};}(document));
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){t.currentNode.style.outline='1px dotted red';console.log(t.currentNode);}};}(document));
    ```
  7. @cuth cuth revised this gist Jul 9, 2014. 1 changed file with 14 additions and 7 deletions.
    21 changes: 14 additions & 7 deletions debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,12 +1,19 @@
    # Debug Horizontal Scroll

    ```js
    var docWidth = document.documentElement.offsetWidth,
    treeWalker = document.createTreeWalker(document.body);
    (function (d) {
    var w = d.documentElement.offsetWidth,
    t = d.createTreeWalker(d.body);
    while(t.nextNode()) {
    if (t.currentNode.offsetWidth > w) {
    console.log(t.currentNode);
    }
    };
    }(document));
    ```

    while(treeWalker.nextNode()) {
    if (treeWalker.currentNode.offsetWidth > docWidth) {
    console.log(treeWalker.currentNode);
    }
    };
    Bookmarklet

    ```
    javascript:(function(d){var w=d.documentElement.offsetWidth,t=d.createTreeWalker(d.body);while(t.nextNode()){if(t.currentNode.offsetWidth > w){console.log(t.currentNode);}};}(document));
    ```
  8. @cuth cuth created this gist Jul 9, 2014.
    12 changes: 12 additions & 0 deletions debug-scroll.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,12 @@
    # Debug Horizontal Scroll

    ```js
    var docWidth = document.documentElement.offsetWidth,
    treeWalker = document.createTreeWalker(document.body);

    while(treeWalker.nextNode()) {
    if (treeWalker.currentNode.offsetWidth > docWidth) {
    console.log(treeWalker.currentNode);
    }
    };
    ```