To update or change the line height, follow these steps:
https://jsfiddle.net/9hznp00s/12/
function deleteRow(id) {
if (typeof (id) === 'undefined') return;
var element = document.getElementById(id);
// Set the row's height and opacity to 0 (the changes are animated by the CSS)
// I commented this out so it's easier to see the collapse effect
//element.style.opacity = 0;
element.style.height = '0px';
element.style.maxHeight = '0px';
element.style.lineHeight = '0px';
element.style.opacity=0.0;
// After the animation is done, remove the row form the HTML
setTimeout(function () {
element.innerHTML = '';
element.parentNode.removeChild(element);
}, 500);
}
Alternatively, you can try one of these options:
https://jsfiddle.net/9hznp00s/8/
function deleteRow(id) {
if (typeof (id) === 'undefined') return;
var element = document.getElementById(id);
// Set the row's height and opacity to 0 (the changes are animated by the CSS)
// I commented this out so it's easier to see the collapse effect
//element.style.opacity = 0;
element.style.height = '0px';
element.style.maxHeight = '0px';
element.style.fontSize = '0px';
// After the animation is done, remove the row form the HTML
setTimeout(function () {
element.innerHTML = '';
element.parentNode.removeChild(element);
}, 500);
}
https://jsfiddle.net/9hznp00s/10/
function deleteRow(id) {
if (typeof (id) === 'undefined') return;
var element = document.getElementById(id);
// Set the row's height and opacity to 0 (the changes are animated by the CSS)
// I commented this out so it's easier to see the collapse effect
//element.style.opacity = 0;
element.style.height = '0px';
element.style.maxHeight = '0px';
element.style.fontSize = '0px';
element.style.opacity=0.0;
// After the animation is done, remove the row form the HTML
setTimeout(function () {
element.innerHTML = '';
element.parentNode.removeChild(element);
}, 500);
}