Изображение не может появиться при использовании Modal

-1

Хотя я различал модальности, только первый модальный работает, но второй модальный всплывает изображение для первого модального, хотя исходное изображение является вторым модальным. Может кто-то, пожалуйста, помогите мне в сортировке этой проблемы?Изображение не может появиться при использовании Modal

<div class="col-xs-6 col-md-3"> 
    <div class="portfolio-item"> 
    <img class="img-portfolio img-responsive" src="img/arnold200x200.png" data-toggle="modal" data-target="#modal1"> 
    <div class="caption"> 
     <h3>Amino X</h3> 
     <p> 
     <a href="#" class="btn btn-primary" role="button">GHS 200</a> 
     </p> 
    </div> 
    </div> 
</div> 

<!-- Modal AminoX--> 
<div class="modal fade" id="modal1"> 
    <div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <a href="img/arnold.png" data-title="My First Caption" data-toggle="modal" /> 
     <h4 class="modal-title">Amino X</h4> 
     </div> 
     <div class="modal-body"> 
     <img src="img/arnold.png" width="350px" class="img-thumbnail" /> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
    </div> 
</div> 

<div class="col-xs-6 col-md-3"> 
    <div class="portfolio-item"> 
    <img class="img-portfolio img-responsive" src="img/amino_x200x200.png" data-toggle="modal" data-target="#modal1" /> 
    <div class="caption"> 
     <h3>Amino X</h3> 
     <p> 
     <a href="#" class="btn btn-primary" role="button">GHS 200</a> 
     </p> 
    </div> 
    </div> 
</div> 

<!-- Modal AminoX--> 
<div class="modal fade" id="modal2"> 
    <div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <a href="img/amino_x200x200.png" data-title="My Second Caption" data-toggle="modal" /> 
     <h4 class="modal-title">Amino X</h4> 
     </div> 
     <div class="modal-body"> 
     <img src="img/aminoBig.png" width="350px" class="img-thumbnail" /> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal2">Close</button> 
     </div> 
    </div> 
    </div> 
</div>

источник

2017-02-14 Sleeper

Вы можете включить код JavaScript, который использует модальность, чтобы мы могли увидеть, что может быть не так с ним? – Nope

Вы установили оба data-target = "# modal1"? – David

Я уже опубликовал этот код @Fran – Sleeper

Вы ссылки modal1 в обеих ссылках, обновлении:

data-target="#modal2"

Fiddle

источник

2017-02-14 10:40:25 David

он по-прежнему дает ту же ошибку, даже когда цель данных изменена на # modal2 – Sleeper

Я думал, что вы проблема в том, что обе ссылки открыли первый модальный, я никогда не видел, что вы javascript просто html – David

да, это проблема @David – Sleeper

Изображение не может появиться при использовании Modal

ответ

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