show and hide div

Welcome to ScriptMode
Tom R
Posts: 150
Joined: Fri Aug 28, 2015 9:58 am

show and hide div

Postby Tom R » Mon Mar 07, 2016 1:59 pm

how to show and hide div while clicking on a Anchor tag?

html :

<div class="user-profile user-listing-content clearfix" id="weeklyandmonthly" style="display:none;">
<h4>Long-term prices</h4>
<div class="user-details padding-right-left">
<form>
<p>Encourage guests to book longer reservations by offering a discount. <a style="color: #ff5a5f;">How are my discounts calculated?</a></p>
<div class="input-field">
<input id="weekly" type="text">
<label for="weekly">Weekly discount</label>
</div>
<p style="color:teal;">Tip :&nbsp;15 % &nbsp;<i class="fa fa-question-circle popr" data-id="1" style="font-size:16px !important;"></i></p>
<div class="popr-box" data-box-id="1">
<a><div class="popr-item">You alone are responsible for choosing the pricing and availability of your listing</div></a>

</div>
<div class="input-field">
<input id="monthly_discount" type="text">
<label for="monthly_discount">Monthly discount</label>
</div>
<p style="color:teal;">Tip :&nbsp;15 % &nbsp;<i class="fa fa-question-circle popr" data-id="2" style="font-size:16px !important;"></i></p>
<div class="popr-box" data-box-id="2">
<a><div class="popr-item">You alone are responsible for choosing the pricing and availability of your listing</div></a>

</div>
<div style="clear: both;"></div>

</form>
</div>
</div>

Heisenberg
Posts: 117
Joined: Thu Aug 27, 2015 7:16 am

Re: show and hide div

Postby Heisenberg » Wed Mar 09, 2016 9:36 am

<script>
$('.hide-details').click(function(){
$('#weeklyandmonthly').toggle();
});
</script>


Return to “General”

Who is online

Users browsing this forum: No registered users and 1 guest