Currently, I have implemented a menu with the .fadeToggle
function on my website.
There are buttons on the page that, when clicked, display a different section of information.
While everything is functioning correctly and users can navigate through the site, I am looking for a way to prevent them from clicking on the same button and causing the screen to go blank.
However, using e.stopPropagation()
prevents me from being able to navigate smoothly.
Any suggestions would be greatly appreciated.
HTML:
</div><div id="toggleContainer2">
<p><p>This is not an advertising platform, all selected agencies are more or less a subjective choice. The author reserves the right not to be responsible for the topicality, correctness, completeness or quality of the information provided. Liability claims regarding damage caused by the use of any information provided, including any kind of information which is incomplete or incorrect, will therefore be rejected. </p>
<p>All offers are not-binding and without obligation. Parts of the pages or the complete publication including all offers and information might be extended, changed or partly or completely deleted by the author without separate announcement.</p></p>
</div>
...
<a class="btn" id="trigger2">Disclaimer</a>
JS:
<script>
$(document).ready(function() {
// toggle advanced search
$("#toggleContainer2").hide();
$("#trigger2").click(function() {
$("#toggleContainer2").fadeToggle(1500);
$("#toggleContainer").hide();
});
});
</script>