How to get the longest height of the div from pure javascript?
up vote
1
down vote
favorite
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 |
up vote
1
down vote
favorite
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 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
– Yash Karanke
Nov 20 at 0:32
add a comment |
up vote
1
down vote
favorite
up vote
1
down vote
favorite
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 at 0:01
Yash Karanke
12816
12816
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 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
– Yash Karanke
Nov 20 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 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
– Yash Karanke
Nov 20 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 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 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– Yash Karanke
Nov 20 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– Yash Karanke
Nov 20 at 0:32
add a comment |
2 Answers
2
active
oldest
votes
up vote
1
down vote
accepted
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?
– Yash Karanke
Nov 20 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 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
See the update for my response
– Intervalia
Nov 20 at 16:57
Works like charm
– Yash Karanke
Nov 20 at 17:02
add a comment |
up vote
2
down vote
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',
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
up vote
1
down vote
accepted
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?
– Yash Karanke
Nov 20 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 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
See the update for my response
– Intervalia
Nov 20 at 16:57
Works like charm
– Yash Karanke
Nov 20 at 17:02
add a comment |
up vote
1
down vote
accepted
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?
– Yash Karanke
Nov 20 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 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
See the update for my response
– Intervalia
Nov 20 at 16:57
Works like charm
– Yash Karanke
Nov 20 at 17:02
add a comment |
up vote
1
down vote
accepted
up vote
1
down vote
accepted
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 at 16:57
answered Nov 20 at 0:18
Intervalia
3,96211031
3,96211031
Okay, point taken, but, I'm passing an entire Object inMath.max
, shouldn't that suffice to give out maximum number from the Object?
– Yash Karanke
Nov 20 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 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
See the update for my response
– Intervalia
Nov 20 at 16:57
Works like charm
– Yash Karanke
Nov 20 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?
– Yash Karanke
Nov 20 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 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
See the update for my response
– Intervalia
Nov 20 at 16:57
Works like charm
– Yash Karanke
Nov 20 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?– Yash Karanke
Nov 20 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?– Yash Karanke
Nov 20 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 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 at 0:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
Quick question: now how do I use this value as height for the rest of the divs?
– Yash Karanke
Nov 20 at 16:44
See the update for my response
– Intervalia
Nov 20 at 16:57
See the update for my response
– Intervalia
Nov 20 at 16:57
Works like charm
– Yash Karanke
Nov 20 at 17:02
Works like charm
– Yash Karanke
Nov 20 at 17:02
add a comment |
up vote
2
down vote
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 |
up vote
2
down vote
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 |
up vote
2
down vote
up vote
2
down vote
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 at 0:10
Abana Clara
1,452719
1,452719
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.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- 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 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– Yash Karanke
Nov 20 at 0:32