javascript - Create Image modal -


i'm trying create image modal in app!i want create modal such link https://codepen.io/koolhaus/pen/ajwce code is:

.portfolio-list a:after {    color: #ffff;    content: '\f067';    font-family: fontawesome;    max-width: 100%;    position: absolute;    width: 100%;    height: 100%;    top: 0;    left: 0;    display: flex;    background: rgba(0, 0, 0, 0.6) center center no-repeat;    opacity: 0;    transition: 0.5s;    -webkit-transition: 0.5s;    text-align: center;    align-items: center;    justify-content: center;  }
<div class=" portfolio-container text-center">    <ul class="portfolio-list" style="margin:0 auto">      <li style="margin:0 auto">        <a href="#">          <img src="{{$img['image']}}">        </a>      </li>    </ul>  </div>

how can add modal in code?

my reference jsfiddle

keep div in side modal-body. kept once check out in local host. don't forget add references html

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 

Comments

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

vue.js - Create hooks for automated testing -

Add new key value to json node in java -