Añadir botón pare cerra ventana
Publicado por Joseba (6 intervenciones) el 30/04/2020 13:10:43
Aupa!, he copiado este code que esta aquí https://gist.github.com/shrestharikesh/f4d094e0a64f10aa991733506fd9d791, la persona que ha hecho este code, lo ha puesto aquí para ver como funciona https://codepen.io/nsom/pen/VbqLew
Como lo tengo yo,
Como llamo a las lbrerias de javascript y html de mi pagina Web,
El Html,
El Css,
y el code de javascript,
El proble es que cuando salen las ventanas, salen sin el botón para cerrarlas, las ventanas se cierran cliqueando fuera de la fotografía,.
https://i.imgur.com/HUNJVsM.png
Me podria decir alguien porfavor como ponerle un botón para cerrar las fotografía ?
Como lo tengo yo,
Como llamo a las lbrerias de javascript y html de mi pagina Web,
1
2
3
4
5
6
7
8
9
10
11
12
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" rel="stylesheet"/>
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.min.js"> </script>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.2.0/ekko-lightbox.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.2.0/ekko-lightbox.min.css" rel="stylesheet" />
El Html,
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="container">
<div class="row">
<a href="/kalamulur/Taschen-&-Rucksäcke/Rucksäcke/fenster/photo/113.jpg" data-toggle="lightbox" data-gallery="gallery" class="col-md-3" >
<img src="/kalamulur/Taschen-&-Rucksäcke/Rucksäcke/fenster/photo/113.jpg" class="img-fluid rounded">
</a>
<a href="/kalamulur/Taschen-&-Rucksäcke/Rucksäcke/fenster/photo/2-2.jpg" data-toggle="lightbox" data-gallery="gallery" class="col-md-3">
<img src="/kalamulur/Taschen-&-Rucksäcke/Rucksäcke/fenster/photo/2-2.jpg" class="img-fluid rounded">
</a>
<a href="/kalamulur/Taschen-&-Rucksäcke/Rucksäcke/fenster/photo/3-2.jpg" data-toggle="lightbox" data-gallery="gallery" class="col-md-3">
<img src="/kalamulur/Taschen-&-Rucksäcke/Rucksäcke/fenster/photo/3-2.jpg" class="img-fluid rounded">
</a>
</div>
</div>
El Css,
1
2
3
4
5
.row {
margin: 15px;
}
image { width: 70%; padding-left: 3rem;}
y el code de javascript,
1
2
3
4
$(document).on("click", '[data-toggle="lightbox"]', function(event) {
event.preventDefault();
$(this).ekkoLightbox();
});
El proble es que cuando salen las ventanas, salen sin el botón para cerrarlas, las ventanas se cierran cliqueando fuera de la fotografía,.
https://i.imgur.com/HUNJVsM.png
Me podria decir alguien porfavor como ponerle un botón para cerrar las fotografía ?
Valora esta pregunta


0