-
Notifications
You must be signed in to change notification settings - Fork 16
/
magnificpopup.jquery.txt
173 lines (169 loc) · 16.5 KB
/
magnificpopup.jquery.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
MAGNIFICPOPUP
VERSION ==> #0.9.6
JQ.magnificPopup(OBJ) #Lightbox plugin (gallery + popover).
#JQ can be (can change after initialization) (appears on click) :
# - one or many <a href|data-mfp-src=STR1>...</a>
# - any ELEM, with options "items: [{ src: STR2[, type: STR3] }...]
# - any ELEM above descendant of a parent, using the options "delegate: STR",
# where STR is the selector
# - no ELEM, by calling $.magnificPopup.open(OBJ)
#The type of STR1 et STR2 depend on the type :
# - image : image URL
# - iframe : link URL
# - inline : selector STR of a DOM element, JQ or code HTML STR.
# DOM element can have class .mfp-hide to hide it when not popped up
# - ajax : link URL
#OBJ are (not only instantiation) :
# - (mandatory) type. Can alternatively add class mfp-TYPE to JQ instead.
# Can be (and have following properties with same name) :
# - image OBJ :
# - markup : HTML code. .mfp-img and .mfp-close are replaced by image and
# close button
# - cursor STR (def: "mfp-zoom-out-cur")
# - titleSrc STR (def: "title") : HTML attribute of JQ used as a title of
# the item
# - verticalFit BOOL (def: true) : if false, doesn't fit automatically
# the image vertically. Can also leave a verticalGap NUM on top.
# - iframe OBJ : IFRAME with src set to URL.
# Can embedding anything, like Youtube videos, Google Maps, etc.
# - markup : HTML code.
# - srcAction : "STR_ATTR" : find element in the popup content using
# selector STR and change its ATTR using ATTRVAL. (def: "iframe_src")
# ATTRVAL is defined by patterns
# - patterns OBJ, where members are :
# - any VAR : OBJ2, where members are :
# - index STR : use this pattern if url contains STR
# - id STR : delimiter splitting ATTRVAL. The second part is used as
# %id%.
# - src STR : replace ATTRVAL by STR. Can contain %id%
# - example : youtube:{ index: "youtube.com/", id: "v=",
# src: "//www.youtube.com/embed/%id%?autoplay=1" }
# Support for Youtube, Google Maps and Vimeo is already added, but more
# can be added.
# - inline OBJ : HTML element
# - ajax OBJ :
# - settings OBJ : parameters to $.ajax()
# - cursor STR (def: "mfp-ajax-cur") (while loading)
# - disableOn NUM|FUNC (def: null) : doesn't trigger when :
# - NUM : window width < NUM pixels
# - FUNC() renvoie false
# Doesn't work if $.magnificPopup.open()
# - midClick BOOL (def: false) : opens on middle clic / CTRL-click
# - closeOnContentClick BOOL (def: false) : closes on clic on the popup
# content
# - closeOnBgClick BOOL (def: true) : closes on clic on the overlay
# - showCloseBtn BOOL (def: true)
# - closeBtnInside BOOL (def: true) : close button is next to content
# (not on top right corner)
# - closeMarkup STR (def: '<button title="%title%" class="mfp-close">
# <i class="mfp-close-icn">×</i></button>') : HTML code of the close
# button. %title% is replaced by property cTitle
# - enableEscapeKey BOOL (def: true)
# - modal BOOL (def: false) : put closeOnContentClick, closeOnBgClick,
# showCloseBtn and enableEscapeKey to false
# - gallery: create a user-managed "slideshow".
# Only on JQ with one item.
# Can navigate using JQ.magnificPopup("prev|next") or
# JQ.magnificPopup("goTo", UINT)
# OBJ where members are :
# - enabled BOOL (def: false)
# - navigateByImgClick BOOL (def: true)
# - arrowMarkup STR : HTML code of navigation arrows. Def is '<button
# title="%title%" type="button" class="mfp-arrow mfp-arrow-%dir%">
# </button>'. %title% is tPrev|tNext
# - preload [NUM, NUM2] : preload previous NUM items and next NUM2 items
# (def: [0,2]). Take direction into account.
# - zoom : make a zoom animation from the JQ on open|close.
# Cannot use with gallery.
# Only with type: image. Members are :
# - enabled BOOL (def: false)
# - duration NUM (def: 300)
# - easing STR (def: "ease-in-out") : CSS transition
# ("ease[-in][-out]" or "cubic-bezier")
# - opener FUNC : element JQ displayed in transition.
# FUNC(JQ), and returns JQ2. By default return JQ.find("img"), so JQ
# needs to have thumbnail IMG with same image.
# - preloader BOOL (def: true) : adds a loading indicator and error messages
# - focus STR (def: "", ie. popup itseld) : selector for element which should
# have the focus
# - removalDelay NUM (def: 0) : delay before destroying popup, if a closing
# animation happens
# - alignTop BOOL (def: false) : puts popup on vertical top, not center
# - overflowY (def: "auto") : of the popup content
# - fixedContent|BgPos BOOL (def: "auto") : whether CSS position should be
# fixed or absolute
# - mainClass : adds a class to .mfp-bg and mfp-wrap objects
# - callbacks OBJ : event handlers (can also use JQEVENT "mfpOpen", etc.) :
# - open|close FUNC()
# - beforeOpen|afterClose FUNC()
# - change FUNC() : content changed
# - elementParse FUNC(JQ) : item being insertion, can change it.
# - resize FUNC() : window resize
# - imageLoadComplete FUNC()
# - parseAjax FUNC(JQ) : response from $.ajax success callback. Can change
# it.
# - ajaxContentAdded FUNC()
# - buildControls: function() { this.contentContainer.append(
# this.arrowLeft.add(this.arrowRight)); }, to have arrows inside instead
# of outside. Should also set display:none on .mfp-s-loading and
# .mfp-arrow.
# - some properties for i18n (defines messages) :
# - tClose STR (def: 'Close (Esc)')
# - tLoading STR (def: 'Loading...')
# - gallery: {
# tPrev STR (def: 'Previous (Left arrow key)')
# tNext STR (def: 'Next (Right arrow key)')
# tCounter STR (def: '%curr% of %total%')
# }
# - image: { tError STR } (def: '<a href="%url%">The image</a> could not
# be loaded.')
# - ajax: { tError STR } (def: '<a href="%url%">The request</a> failed.')
# Can also do $.extend(true, $.magnificPopup.defaults, { ... }) to have it
# for all JQ possible
#CSS (the HTML element is in parentheses) :
# - .mfp-zoom-out-cur : on BODY when popup is on
# - .mfp-bg (JQ.bgOverlay) : the overlay
# - .mfp-wrap : the rest.
# - .mfp-container (JQ.container) : a wrapper inside .mfp-wrap.
# Has additional classes .mfp-s-loading|ready|error (if preloader is
# true)
# - .mfp-content (JQ.contentContainer) : the popup itself
# - .mfp-figure (JQ.content) : wrapper inside
# - .mfp-close : close BUTTON (can be child of .mfp-container
# depending on closeBtnInside)
# - .mfp-img : the IMG
# - .mfp-bottom-bar
# - .mfp-title
# - .mfp-counter
# - .mfp-preloader : "Loading..." indicator
# - .mfp-arrow[-left|right] (JQ.arrowLeft|Right) : arrow when gallery
# .mfp-wrap can have additional classes :
# - .mfp-close-btn-in BOOL : depending on closeBtnInside
# - .mfp-gallery : depending on gallery
# - .mfp-align-top : depending on alignTop
# .mfp-wrap and .mfp-bg can have additional classes (for CSS show|hide
# animation)
# - nothing|.mfp-ready|.mfp-removing depending on state (.mfp-removing
# almost instant if no removalDelay)
#Can also access HTML elements :
# - $.magnificPopup.instance.currItem OBJ, with members:
# - data OBJ with members :
# - close_replaceWith JQ : close button
# - counter STR, e.g. "1 of 2"
# - img_replaceWith JQ : .mfp-img
# - src STR
# - title STR
# - img JQ
# - index UINT
# - loaded|parsed|preloaded BOOL
# - src STR
# - type STR
# - $.magnificPopup.instance.items JQ
# - $.magnificPopup.instance.index UINT
$.magnificPopup.open(OBJ) #Same OBJ as main function, but not attached to a JQ.
$.magnificPopup.close()
JQ.magnificPopup("close") #
$.magnificPopup.instance.isOpen #True or undefined
$.magnificPopup.instance.direction #BOOL : false if going backward