5 months ago

dropdown menu isn't working fine in JQuery slider

Posted 5 months ago by JOHNMAC

I created jquery dropdown menu in slider. and added slide effect on dropdown menu like this . If I click on one slide it opens but by clicking other slide the previousone close and then by clicking it again it opens, I need slide like this "without hover(i.e by click method)",

html code:

  <div class="carousel slide col-md-10 col-xs-12" data-ride="carousel" data-interval="false" id="myCarousel">

jQuery Code:

         $('.create-meeting-form').stop().slideToggle();   //stop or delay(1000)



        pause: true,
        interval: false,

   function setMeetingCarausel() {
      let meetingsCopy = utils.setSliders(Array.from(meetings));

      let html = '<div class="carousel-inner no-padding">';, index) => {
            html += `<div class="item ${index === 0 ? 'active' : ''}">`;
   => {
            let className = m.status === 'completed' ? 'btn btn-warning btn-lg dashboard-icon' : 'btn btn-success   
          btn-lg dashboard-icon'
  html += `
        <div class="col-md-3 col-sm-6 col-xs-12" onclick="handleClickMeetingItem('${m._id}')">
            <span href="" class="${className}" style="width: 200px; height: 150px;">
            <p style="padding-top: 10px; font-size: 19px; font-weight: bold;">${m.subject}</p>
            <p style="padding-top: 12px; font-size: 19px; font-weight: bold;">${utils.convertDate(}</p>
            <p style="padding-top: 10px; font-size: 19px; font-weight: bold;">( ${m.status} )</p>
      html += `</div>`;
   html += `
      <a class="left carousel-control" href="#myCarousel" data-slide="prev">
          <span class="glyphicon glyphicon-chevron-left" style="margin-left:63px; color:grey;"></span>
      <a class="right carousel-control" href="#myCarousel" data-slide="next">
          <span class="glyphicon glyphicon-chevron-right" style="margin-right:140px; color:grey;"></span>


Please sign in or create an account to participate in this conversation.