In the current version of my code, I have the following:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
$( "#grow" ).click(function(){
$( "#background" ).animate( { height: "800" })
});
$( "#shrink" ).click(function(){
$( "#background" ).animate({ height: "585" });
});
It allows the background container to grow or shrink while keeping the bottom CSS aligned underneath the main form. However, I now need to adjust the height to accommodate a dropdown menu with a hidden field and an associated error message (or reduce it if another dropdown selection is made).
Do you have any suggestions on how I can achieve this? The ID of my dropdown menu is: ddlFeedbackType, and it has an onChange event handler named onchange="ShowHidePageURL()". Here is the script for hiding/showing elements:
var x;
var o = document.getElementById('plc_lt_zoneContent_pageplaceholder_pageplaceholder_lt_zoneCenter_ASME_FormsSuggestionForm_ddlFeedbackType');
if (o.options[o.selectedIndex].text == "Report a Bug") {
x = document.getElementById('divPageURLlabel');
x.style.display = "block";
x = document.getElementById('divPageURLtext');
x.style.display = "block";
x = document.getElementById('divFeedbackType');
x.style.display = "none";
x = document.getElementById('lblFeedbackType');
x.style.display = "none";
}
I am unsure how to integrate all of this together. Any assistance would be greatly appreciated. Thank you.