Menu
Community /Pin to ProfileBookmark
@daveyerwinJul 14.2021 — #@chrisjchrisj#1634153
<textarea name="comments" id="comments" placeholder="Enter Text Here</textarea>
should be ...
<textarea name="comments" id="comments" placeholder="Enter Text Here"></textarea>@daveyerwinJul 14.2021 — #
Drop-down panel doesn’t push down the container below
I have added this code to a web page where a page visitor can click the down arrow which drops down a panel successfully. However, the div container (Container1) ()below the panel) doesn’t push down properly when the panel drops down. The panel appears to drop down behind the Container1. I’m looking for guidance on how to have Container1 properly push down when the panel drops down. Any assistance is appreciated.
“`
<script>
$(document).ready(function(){
$(“#flip”).click(function(){
$(“#panel”).slideToggle(“slow”);
});
});
</script>
</head>
<body>
<div id=”flip”>Panel Controls <img src=”/images/chevron.png” alt=”arrow down”></div>
<div id=”panel”>
<div class=”enter-text”>
<textarea name=”comments” id=”comments” placeholder=”Enter Text Here</textarea>
<button id=”submit”>Submit</button>
</div>
<div class=”buttons”>
<span><button id=”start” onclick=”initialize()”>Start</button></span>
<span><button id=”stop” onclick=”clearInterval(lefttime)”>Stop</button></span>
</div>
</div>
<div id=”Container1″>
</div>
Sign in
to post a comment3 Comments(s) ↴
0
@daveyerwinJul 14.2021 — #<textarea name="comments" id="comments" placeholder="Enter Text Here</textarea>
should be ...
<textarea name="comments" id="comments" placeholder="Enter Text Here"></textarea>
0
@daveyerwinJul 14.2021 — #``<i>
</i><html lang="en">
<head>
<meta charset="UTF-8">
<style>
body{margin:0px;color:#252430;background-color:#eee}
p{margin-top: 10em; font-size: 2em;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip").click(function(){
$("#panel").slideToggle("slow");
});
});
</script>
</head>
<body>
<div id="flip">
Panel Controls
<img src="/images/chevron.png" alt="arrow down">
</div>
<div id="panel">
<div class="enter-text">
<textarea name="comments" id="comments" placeholder="Enter Text Here">
</textarea>
<button id="submit">
Submit
</button>
</div>
<div class="buttons">
<span>
<button id="start" onclick="initialize()">
Start
</button>
</span>
<span>
<button id="stop" onclick="clearInterval(lefttime)">
Stop
</button>
</span>
</div>
</div>
<div id="Container1">
xxxxxxxxxxxxxxxxxxxxxxxxx
</div>
<script>$("#panel").toggle();</script>
</body>
</html> <i>
</i>``