Индикатор выполнения в popover

Использование Bootstrap Я вставил индикатор выполнения в popover (я использую его для отображения статистики), но проблема в том, что индикатор выполнения выходит за пределы поля, это мой код:Индикатор выполнения в popover

$("#sword").popover({ trigger: "hover" , placement: 'top', html:true, 
 
       
 
       content: function() {return $("#ppf").html();}  
 
       });

<div class="hide" id="ppf"> 
 
      <div class="container"> 
 
       <h5 class="progress-label"> Others: </h5> <div class="progress" style=""> 
 
    <div class="progress-bar" role="progressbar" aria-valuenow="66" 
 
    aria-valuemin="0" aria-valuemax="100" style="width:66%">66%</div> 
 
        </div> 
 
      <br/><br/> 
 
      
 
      </div></div>

что я могу сделать так, чтобы прогресс бар пребывание в границе пирог, в дополнение к еще отзывчивым.

источник

2016-08-16 Parc Roi

Попробуйте изменить '' container' в контейнер-fluid'. Первая имеет фиксированную ширину и может заставлять ваш индикатор выполнения быть шире, чем popover. В качестве альтернативы вы можете полностью удалить его; на самом деле нет смысла использовать '.container', если все, что вы делаете, это вставить это в popover. –

@RobertC На самом деле я добавил класс контейнера, так как я хотел выровнять метку и индикатор выполнения в той же строке. В любом случае, оба ваших решения работают нормально. Спасибо :) –

Вам необходимо создать элемент меча, а затем установить ppf style = "display: none;"

и то, что здесь пример вашего же кода

<div id="info" style="display:none;"> 
    <div class="container"> 
    <h5 class="progress-label"> Others: </h5> 
    <div class="progress" style=""> 
     <div class="progress-bar" role="progressbar" aria-valuenow="66" 
     aria-valuemin="0" aria-valuemax="100" style="width:66%">66% 
     </div> 
    </div><br/><br/> 
    </div> 
</div> 

<button type="button" class="btn"> 
    Popover on right 
</button>

Example working on JsFiddle

источник

2017-05-25 16:08:22

Индикатор выполнения в popover

ответ

Смежные вопросы