How to expand a div using min-height in javascript

Question

0.00/5 (No votes)

See more:

Hi Everyone

I am working on a piece of code where I need to fill some points (text) in a div which acts as an accordion. I implemented it using the code below.
I achieved the desired output but when the points increase in numbers and goes above the height 50px, I loose some data. I dont want a scroll bar. I want to increase the height of the div.
Can I achieve the output using min-height?
I tried with
var tp1 = parseInt(document.getElementById("div1").style.minheight);
but it did not work.

Please help

Thankyou

JavaScript

 <script>
function doev1() {
var tp1 = parseInt(document.getElementById("div1").style.height);
if (tp1 > 0) {
document.getElementById("div1").style.height = "0px";
}
else 
{                                                   document.getElementById("div1").style.height = "50px";
}
}
</script>

Posted 13-Oct-14 8:23am

JPais

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

VC.J · Answer 1 · 2014-10-13T09:00:00

Solution 1

have u use like this
document.getElementById("myDIV").style.minHeight="100px";

I have noticed that in "minHeight" h is small in your syntax

Posted 13-Oct-14 9:00am

VC.J

Comments

JPais 13-Oct-14 15:09pm

Hi..
Sorry it was a mistake withthe h. But yes I have tried it, it did not work.

VC.J 13-Oct-14 15:26pm

the java script you have provided is working good
I use this code to call
More >>>
<div id="div1" style="height:10px;"></div>
and the logic is running fine in your script
so where do you getting the error

JPais 14-Oct-14 1:48am

Yes the javascript is working well. But when I fill the div myDIV with content, I want the div to expand in height and not restrict to 50px.

I tried
document.getElementById("div1").style.height = document.getElementById("div1").style.minHeight;
But it didn't work.
I guess iits not the right way.

VC.J 14-Oct-14 3:01am

what min height you have set
I think you get confused in min height and height
min height is use to set the minimum height of element
read this
http://www.w3schools.com/cssref/pr_dim_min-height.asp