【JQuery】magnificPopupで、インラインでモーダル開く
magnificPopupで、同ページ内の要素をインラインでモーダル表示する方法です。
html
<a class="modalLink" href="#modalBox">モーダルが開きます</a> <div id="modalBox"> モーダルです。 </div>
javascript
$(document).ready(function () { $('.modalLink').magnificPopup({ type: 'inline', preloader: false }); });
scss
.mfp-container{ .modalBox { display: block; } } .modalBox { display: none; hight :200px; width: 300px; line-height: 200px; margin: 0 auto; background-color: #ccc; text-align: center; }
カテゴリー:JQuery, magnificPopup
コメントを残す