f1x1t/pelican-theme-bootstrap4
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Image popup

Browse Source
This commit is contained in:
Andrei Astafev
2019-04-21 12:12:43 +03:00
parent 04a2dcca22
commit 947c137b2c
4 changed files with 69 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
static/css/style.css
View File

@ -329,3 +329,50 @@ pre, code, kbd, samp
.panel {
padding-bottom: 12px;
}
.popup{
width: 900px;
margin: auto;
text-align: center
}
.popup img{
width: 200px;
height: 200px;
cursor: pointer
}
.show{
z-index: 999;
display: none;
}
.show .overlay{
width: 100%;
height: 100%;
background: rgba(0,0,0,.66);
position: absolute;
top: 0;
left: 0;
}
.show .img-show{
width: 600px;
height: 400px;
background: #FFF;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
overflow: hidden
}
.img-show span{
position: absolute;
top: 10px;
right: 10px;
z-index: 99;
cursor: pointer;
}
.img-show img{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}