久しぶりの投稿になります。ヤマラボです。
今回はよくあります、画像をクリックすると拡大する方法をご紹介します。
デモサイトをご用意しましたので、ご参考までにご確認下さい。
サンプルコードになります。
head箇所に下記コードを記載します。
<head>
<!--拡大表示-->
<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/js/lightbox.min.js" type="text/javascript"></script>
<!--end-->
</head>
body箇所には下記の画像出力コードを記載します。
※イメージのリンク先は任意のURLを指定して下さい。
<a href="img/icon.jpeg" data-lightbox="group"><img src="img/icon.jpeg" width="77" /></a>
ご参考になれば幸いです。
画像をクリックしたら拡大する方法