add magnific popup
bowerel
kilepsz a gulp watch bol
ctrl + x
es
bower install magnific-popup --save
utanna gulp
es gulp watch
es akkor hozza is adta
csak meg kell hivd
--------
meghivni: http://dimsemenov.com/plugins/magnific-popup/documentation.html
mukodo popup, csak a gallery-t kell kitorolni
https://codepen.io/dimsemenov/pen/vKrqs
-----------------------------------------
a main.js-be be kell illeszteni a js-t
$('#open-popup').magnificPopup({
items: [
{
src: 'https://vimeo.com/123123',
type: 'iframe' // this overrides default type
},
{
src: $('<div class="white-popup">Dynamically created element</div>'), // Dynamically created element
type: 'inline'
},
{
src: '<div class="white-popup">Popup from HTML string</div>', // HTML string
type: 'inline'
},
{
src: '#my-popup', // CSS selector of an element on page that should be used as a popup
type: 'inline'
}
],
type: 'image' // this is a default type
});
------------
css-t beilleszteni
#open-popup {padding:20px}
.white-popup {
position: relative;
background: #FFF;
padding: 40px;
width: auto;
max-width: 200px;
margin: 20px auto;
text-align: center;
}
------------------
az #open-popup id-ra ugrik elo
<button id="open-popup">Open popup</button>
<div id="my-popup" class="mfp-hide white-popup">
Inline popup
</div>