嘿大家我想点击img时会在模态中弹出一个img弹出窗口。当单击img时,我将src放在一个变量中,然后将该src添加到我的模态中带有空白src的img中。出于某种原因,模态不会弹出。你能检查我的代码,看看有什么问题吗?
谢谢!我被困了这么久。
$(document).ready(function(){
$('.imggallery2').slick({
slidesToShow: 4,
variableWidth: true,
centerMode: true,
nextArrow: "<span class = 'glyphicon glyphicon-arrow-right'>",
prevArrow: "<span class = 'glyphicon glyphicon-arrow-left'>",
slidesToScroll: 1
});
$("img").click(function(){
var sr=$(this).attr('src');
$('#mimg').attr('src',sr);
$("#myModal").modal();
});
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="blackpropixfallen.css">
<!-- Satisfy Google Font -->
<link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
<!-- Slick Carousel -->
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script>
<div id="myModal" class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class = "reveal">
<!-- Modal Content (The Image) -->
<img src="" id = "mimg" class = "modalimg" width = "280px" height = "280px">
</div>
</div>
</div>
</div>
<div class = "imggallery2">
<img src = "Fallengallery/IMG_4553.jpg">
<img src = "Fallengallery/Interconnected.jpg">
<img src = "Fallengallery/LifeLongLies pt.2 (yellow).jpg">
<img src = "Fallengallery/Mornin' Murderin' Marauder (abstract).jpg">
<img src = "Fallengallery/Mornin' Murderin' Marauder (Red).jpg">
<img src = "Fallengallery/Nightfall (vibrant).jpg">
<img src = "Fallengallery/Paris 15.jpg">
<img src = "Fallengallery/Paris 18.jpg">
<img src = "Fallengallery/Somebody's Watching.jpg">
</div>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>