HTML and jQuery Toggle

HTML Menu for Toggling

This code shows the list of HTML menu items with more/less button to toggle.

<div id="option-list">
	<p>Write Mail</p>
	<p>Inbox</p>
	<p>Sent Mail</p>
	<p>Drafts</p>
	<div id="more-option">
	<p>Chat</p>
	<p>Spam</p>
	<p>Trash</p>
	</div>
</div>

jQuery Toggle to Show/Hide Menu Options

This jQuery script is used to hide and show menu options with toggle effect.

function toggleText() {
     if(!$("#more-option").is(':visible')) {
		$("#more").hide();
		$("#less").show();
	 } else {
		$("#less").hide();
		$("#more").show();
	 }
	$("#more-option").slideToggle();
}

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *

Show Buttons
Hide Buttons
Social Media Auto Publish Powered By : XYZScripts.com