How to get the longest height of the div from pure javascript?
I'm trying to achieve what can be achieved via jQuery but I'm avoiding jQuery for learning javascript. I'm trying to get the highest number from .map
. This is what I've done so far.
function equalHeight(className) {
var i = Array.from(document.getElementsByClassName(className));
i.forEach(function(items) {
console.info(Math.max(items.scrollHeight));
});
}
but this logs nothing
console.info(items.scrollHeight);
logs all three numbers.
I know I'm missing an elementary mistake, Can someone point out what I'm doing wrong?
Basically, I want to get the longest height and set it to the rest of the divs
javascript arrays
add a comment |
I'm trying to achieve what can be achieved via jQuery but I'm avoiding jQuery for learning javascript. I'm trying to get the highest number from .map
. This is what I've done so far.
function equalHeight(className) {
var i = Array.from(document.getElementsByClassName(className));
i.forEach(function(items) {
console.info(Math.max(items.scrollHeight));
});
}
but this logs nothing
console.info(items.scrollHeight);
logs all three numbers.
I know I'm missing an elementary mistake, Can someone point out what I'm doing wrong?
Basically, I want to get the longest height and set it to the rest of the divs
javascript arrays
1
Your code works fine. Need to see the HTML & CSS to determine what is not working for you. That is what is meant by a Minimal, Complete & Verifiable Example
– Randy Casburn
Nov 20 '18 at 0:14
@RandyCasburn Point taken, but I posted this question after reviewing HTML and CSS and didconsole.info(items.scrollHeight);
, so clearly the problem was in my javascript code
– user10415043
Nov 20 '18 at 0:32
add a comment |
I'm trying to achieve what can be achieved via jQuery but I'm avoiding jQuery for learning javascript. I'm trying to get the highest number from .map
. This is what I've done so far.
function equalHeight(className) {
var i = Array.from(document.getElementsByClassName(className));
i.forEach(function(items) {
console.info(Math.max(items.scrollHeight));
});
}
but this logs nothing
console.info(items.scrollHeight);
logs all three numbers.
I know I'm missing an elementary mistake, Can someone point out what I'm doing wrong?
Basically, I want to get the longest height and set it to the rest of the divs
javascript arrays
I'm trying to achieve what can be achieved via jQuery but I'm avoiding jQuery for learning javascript. I'm trying to get the highest number from .map
. This is what I've done so far.
function equalHeight(className) {
var i = Array.from(document.getElementsByClassName(className));
i.forEach(function(items) {
console.info(Math.max(items.scrollHeight));
});
}
but this logs nothing
console.info(items.scrollHeight);
logs all three numbers.
I know I'm missing an elementary mistake, Can someone point out what I'm doing wrong?
Basically, I want to get the longest height and set it to the rest of the divs
javascript arrays
javascript arrays
asked Nov 20 '18 at 0:01
user10415043
1
Your code works fine. Need to see the HTML & CSS to determine what is not working for you. That is what is meant by a Minimal, Complete & Verifiable Example
– Randy Casburn
Nov 20 '18 at 0:14
@RandyCasburn Point taken, but I posted this question after reviewing HTML and CSS and didconsole.info(items.scrollHeight);
, so clearly the problem was in my javascript code
– user10415043
Nov 20 '18 at 0:32
add a comment |
1
Your code works fine. Need to see the HTML & CSS to determine what is not working for you. That is what is meant by a Minimal, Complete & Verifiable Example
– Randy Casburn
Nov 20 '18 at 0:14
@RandyCasburn Point taken, but I posted this question after reviewing HTML and CSS and didconsole.info(items.scrollHeight);
, so clearly the problem was in my javascript code
– user10415043
Nov 20 '18 at 0:32
1
1
Your code works fine. Need to see the HTML & CSS to determine what is not working for you. That is what is meant by a Minimal, Complete & Verifiable Example
– Randy Casburn
Nov 20 '18 at 0:14
Your code works fine. Need to see the HTML & CSS to determine what is not working for you. That is what is meant by a Minimal, Complete & Verifiable Example
– Randy Casburn
Nov 20 '18 at 0:14
@RandyCasburn Point taken, but I posted this question after reviewing HTML and CSS and did
console.info(items.scrollHeight);
, so clearly the problem was in my javascript code– user10415043
Nov 20 '18 at 0:32
@RandyCasburn Point taken, but I posted this question after reviewing HTML and CSS and did
console.info(items.scrollHeight);
, so clearly the problem was in my javascript code– user10415043
Nov 20 '18 at 0:32
add a comment |
2 Answers
2
active
oldest
votes
I am not 100% sure exactly what you are after, but a few things:
1) Switching from getElementsByClassName
to querySelectorAll
gives you an object that has forEach
built in.
2) You were passing in only 1 value to Math.max
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
UPDATE
To your question "now how do I use this value as height for the rest of the divs":
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
But, once you do this then none of the DIVs will change height again.
You could set el.style.minHeight
and then, check again if you change anything in the DIVs.
Okay, point taken, but, I'm passing an entire Object inMath.max
, shouldn't that suffice to give out maximum number from the Object?
– user10415043
Nov 20 '18 at 0:30
1
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in toMath.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
Works like charm
– user10415043
Nov 20 '18 at 17:02
add a comment |
I would use .getBoundingClientRect()
and just compare for every iteration
function equalHeight(className) {
const elements = Array.from(document.getElementsByClassName(className));
let highest = 0;
elements.forEach(function(item) {
const itemH = item.getBoundingClientRect().height;
highest = itemH > highest ? itemH : highest;
});
return highest;
}
Docs: https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53384366%2fhow-to-get-the-longest-height-of-the-div-from-pure-javascript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
I am not 100% sure exactly what you are after, but a few things:
1) Switching from getElementsByClassName
to querySelectorAll
gives you an object that has forEach
built in.
2) You were passing in only 1 value to Math.max
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
UPDATE
To your question "now how do I use this value as height for the rest of the divs":
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
But, once you do this then none of the DIVs will change height again.
You could set el.style.minHeight
and then, check again if you change anything in the DIVs.
Okay, point taken, but, I'm passing an entire Object inMath.max
, shouldn't that suffice to give out maximum number from the Object?
– user10415043
Nov 20 '18 at 0:30
1
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in toMath.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
Works like charm
– user10415043
Nov 20 '18 at 17:02
add a comment |
I am not 100% sure exactly what you are after, but a few things:
1) Switching from getElementsByClassName
to querySelectorAll
gives you an object that has forEach
built in.
2) You were passing in only 1 value to Math.max
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
UPDATE
To your question "now how do I use this value as height for the rest of the divs":
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
But, once you do this then none of the DIVs will change height again.
You could set el.style.minHeight
and then, check again if you change anything in the DIVs.
Okay, point taken, but, I'm passing an entire Object inMath.max
, shouldn't that suffice to give out maximum number from the Object?
– user10415043
Nov 20 '18 at 0:30
1
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in toMath.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
Works like charm
– user10415043
Nov 20 '18 at 17:02
add a comment |
I am not 100% sure exactly what you are after, but a few things:
1) Switching from getElementsByClassName
to querySelectorAll
gives you an object that has forEach
built in.
2) You were passing in only 1 value to Math.max
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
UPDATE
To your question "now how do I use this value as height for the rest of the divs":
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
But, once you do this then none of the DIVs will change height again.
You could set el.style.minHeight
and then, check again if you change anything in the DIVs.
I am not 100% sure exactly what you are after, but a few things:
1) Switching from getElementsByClassName
to querySelectorAll
gives you an object that has forEach
built in.
2) You were passing in only 1 value to Math.max
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
UPDATE
To your question "now how do I use this value as height for the rest of the divs":
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
But, once you do this then none of the DIVs will change height again.
You could set el.style.minHeight
and then, check again if you change anything in the DIVs.
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
function equalHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
var max = equalHeight('.test');
console.info('Max div height:', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
function getMaxHeight(className) {
var max = 0;
document.querySelectorAll(className).forEach(
function(el) {
console.info(Math.max(el.scrollHeight, max));
if (el.scrollHeight > max) {
max = el.scrollHeight;
}
}
);
return max;
}
function setHeight(className, height) {
document.querySelectorAll(className).forEach(
function(el) {
el.style.height = height+'px';
}
);
}
var max = getMaxHeight('.test');
console.info('Max div height:', max);
setHeight('.test', max);
div {
border: 1px dashed red;
margin: 2px 0;
}
<div class="test">one</div>
<div class="test">one<br/>two</div>
<div class="test">one<br/>two<br/>three</div>
edited Nov 20 '18 at 16:57
answered Nov 20 '18 at 0:18
IntervaliaIntervalia
4,32211033
4,32211033
Okay, point taken, but, I'm passing an entire Object inMath.max
, shouldn't that suffice to give out maximum number from the Object?
– user10415043
Nov 20 '18 at 0:30
1
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in toMath.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
Works like charm
– user10415043
Nov 20 '18 at 17:02
add a comment |
Okay, point taken, but, I'm passing an entire Object inMath.max
, shouldn't that suffice to give out maximum number from the Object?
– user10415043
Nov 20 '18 at 0:30
1
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in toMath.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
Works like charm
– user10415043
Nov 20 '18 at 17:02
Okay, point taken, but, I'm passing an entire Object in
Math.max
, shouldn't that suffice to give out maximum number from the Object?– user10415043
Nov 20 '18 at 0:30
Okay, point taken, but, I'm passing an entire Object in
Math.max
, shouldn't that suffice to give out maximum number from the Object?– user10415043
Nov 20 '18 at 0:30
1
1
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in to Math.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Mat.max
wants numbers and not objects. You could change the code to convert from an array of Objects into an array of heights and then pass them in to Math.max.apply(Math, arrayOfVals)
– Intervalia
Nov 20 '18 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
Quick question: now how do I use this value as height for the rest of the divs?
– user10415043
Nov 20 '18 at 16:44
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
See the update for my response
– Intervalia
Nov 20 '18 at 16:57
Works like charm
– user10415043
Nov 20 '18 at 17:02
Works like charm
– user10415043
Nov 20 '18 at 17:02
add a comment |
I would use .getBoundingClientRect()
and just compare for every iteration
function equalHeight(className) {
const elements = Array.from(document.getElementsByClassName(className));
let highest = 0;
elements.forEach(function(item) {
const itemH = item.getBoundingClientRect().height;
highest = itemH > highest ? itemH : highest;
});
return highest;
}
Docs: https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
add a comment |
I would use .getBoundingClientRect()
and just compare for every iteration
function equalHeight(className) {
const elements = Array.from(document.getElementsByClassName(className));
let highest = 0;
elements.forEach(function(item) {
const itemH = item.getBoundingClientRect().height;
highest = itemH > highest ? itemH : highest;
});
return highest;
}
Docs: https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
add a comment |
I would use .getBoundingClientRect()
and just compare for every iteration
function equalHeight(className) {
const elements = Array.from(document.getElementsByClassName(className));
let highest = 0;
elements.forEach(function(item) {
const itemH = item.getBoundingClientRect().height;
highest = itemH > highest ? itemH : highest;
});
return highest;
}
Docs: https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
I would use .getBoundingClientRect()
and just compare for every iteration
function equalHeight(className) {
const elements = Array.from(document.getElementsByClassName(className));
let highest = 0;
elements.forEach(function(item) {
const itemH = item.getBoundingClientRect().height;
highest = itemH > highest ? itemH : highest;
});
return highest;
}
Docs: https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
answered Nov 20 '18 at 0:10
Abana ClaraAbana Clara
1,621919
1,621919
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53384366%2fhow-to-get-the-longest-height-of-the-div-from-pure-javascript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Your code works fine. Need to see the HTML & CSS to determine what is not working for you. That is what is meant by a Minimal, Complete & Verifiable Example
– Randy Casburn
Nov 20 '18 at 0:14
@RandyCasburn Point taken, but I posted this question after reviewing HTML and CSS and did
console.info(items.scrollHeight);
, so clearly the problem was in my javascript code– user10415043
Nov 20 '18 at 0:32