Recently, some of my questions have not been well-received, which makes me feel a bit disheartened. It's important to remember to be kind when providing feedback. I've noticed that some people downvote without offering constructive criticism, which can be frustrating and may even lead to being blocked from asking further questions. While I admit that not all my posts are perfect, I believe it's unfair for others to overreact to simple mistakes that are easily fixable. With that said, let's move on to the actual question.
TL;DR: Be kind!
I have a "settings" div:
<div id="settings">
<p><a href="settings.php" class="settings">Search Settings</a></p>
<p><a href="sync.php" class="settings">Sync Settings</a></p>
<p><a href="anon.php" class="settings">Go Anonymous</a></p>
</div>
To open this div, I have a button:
<a onClick="openSettings()" href="#" class="footer" id="settings-button">Settings</a>
To make the button functionality work, I'm using some simple JavaScript:
$("html").click(function(){
$("#settings").slideUp()
});
$("#settings").click(function(e){
e.stopPropagation();
});
function openSettings() {
$("#settings").slideDown();
}
Oddly enough, when I click the button, the div opens and then immediately closes again. This behavior perplexes me, as I've tried different solutions including referencing Stack Overflow for help.
Related articles:
jQuery: Hide popup if click detected elsewhere
How do I make this popup box disappear when I click outside?
I'm feeling quite lost at this point and any guidance would be greatly appreciated.
Best Regards, Emanuel
EDIT: I just realized I forgot to share my CSS styling information:
div#settings {
display: none;
position: absolute;
right: 20px;
bottom: 50px;
background-color: #9E9E9E;
width: 200px;
box-shadow: 2px 2px 10px #000000;
border-style: solid;
border-color: #000000;
border-width: 1px;
color: #551A8B;
padding-left: 15px;
}