首页 > 代码库 > 下拉框选项

下拉框选项

html代码

<li class="favor-events">
<p><span class="eventcontent">更多优惠活动</span><span class="events-icon-r"></span></p>

</li>
<div class="all-events">
<p class="active">会员享<span></span>折优惠</p>
<p>满<span></span>元立减<b></b>元</p>
</div>

css代码

.favor-events .events-icon-r,.favor-events .events-icon-d{float:right;font-size:18px;margin-top: -2px;}
.favor-events .events-icon-r:after{content:"\e636";}
.favor-events .events-icon-r.events-icon-d:after{content:"\e634";}
.all-events{display:none;width: 100%;background: #f5f5f5;}
.all-events p{padding:5px;}
.all-events p.active{background:#000;color:#fff;}

js代码

$(‘.favor-events‘).click(function(){
$(‘.events-icon-r‘).toggleClass(‘events-icon-d‘);
$(‘.all-events‘).slideToggle(‘slow‘);

})
$(‘.all-events p‘).click(function(){
$(‘.all-events p‘).toggleClass(‘active‘);
$(‘.all-events‘).slideUp(‘slow‘);
$(‘.events-icon-r‘).removeClass(‘events-icon-d‘);
var text1=$(‘.all-events p.active‘).text();
$(‘.favor-events .eventcontent‘).text(text1);
})