Skip to content

Commit b485bc8

Browse files
committed
docs upd, closes #269
1 parent c1ca7bc commit b485bc8

File tree

2 files changed

+24
-14
lines changed

2 files changed

+24
-14
lines changed

website/documentation.md

Lines changed: 21 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -927,8 +927,11 @@ callbacks: {
927927
console.log('Start of popup initialization');
928928
},
929929
elementParse: function(item) {
930+
// Function will fire for each target element
931+
// "item.el" is a target DOM element (if present)
932+
// "item.src" is a source that you may modify
933+
930934
console.log('Parsing content. Item object that is being parsed:', item);
931-
// feel free to modify here item object
932935
},
933936
change: function() {
934937
console.log('Content changed');
@@ -964,12 +967,6 @@ callbacks: {
964967
// "data.text" - text that will be displayed (e.g. "Loading...")
965968
// you may modify this properties to change current status or its text dynamically
966969
},
967-
elementParse: function(item) {
968-
console.log('Parsing element:', item);
969-
// triggers only once for each item
970-
// here you may modify URL, type, or any other data
971-
},
972-
973970
imageLoadComplete: function() {
974971
// fires when image in current popup finished loading
975972
// avaiable since v0.9.0
@@ -1155,17 +1152,29 @@ See [example on CodePen](http://codepen.io/dimsemenov/pen/JGjHK).
11551152

11561153
### How to override some function without modifying the source files?
11571154

1158-
Rewrite the function that you wish to modify by editing Magnific Popup class prototype, you can access it like so `$.magnificPopup.proto`. For example to override function that sets focus on some element:
1155+
Rewrite the function that you wish to modify by editing Magnific Popup object, you can access it like so `$.magnificPopup.instance`. For example to override function that goes to "next" item in gallery:
11591156

11601157
{% highlight javascript %}
1161-
// add this code after popup JS file is included, but before popup is initialized
1162-
$.magnificPopup.proto._setFocus = function() {
1163-
(mfp.st.focus ? mfp.content.find(mfp.st.focus).eq(0) : mfp.wrap).focus();
1158+
// add this code after popup JS file is included
1159+
$.magnificPopup.instance.next = function() {
1160+
1161+
// Do something
1162+
1163+
// You may call parent ("original") method like so:
1164+
$.magnificPopup.proto.next.call(this /*, optional arguments */);
11641165
};
11651166
{% endhighlight %}
11661167

11671168
You may override any public function, just note that this change applies globally.
11681169

1170+
### Known issues
1171+
1172+
### Text input in [Select2](http://ivaynberg.github.io/select2/) plugin is inactive when added inside popup
1173+
1174+
Refer to [this discussion on GitHub](https://github.com/dimsemenov/Magnific-Popup/issues/280).
1175+
11691176
<h2 id="contribute">Make Magnific Popup better!</h2>
11701177

1171-
Improve this documentation page <a href="https://github.com/dimsemenov/Magnific-Popup/edit/master/website/documentation.md">via GitHub</a> (simply submit commit). Any improvements, including your own CodePen examples are very welcome.
1178+
Improve this documentation page <a href="https://github.com/dimsemenov/Magnific-Popup/edit/master/website/documentation.md">via GitHub</a> (simply submit commit). Any improvements, including your own CodePen examples are very welcome. And, lastly, don't forget to star the script on GitHub:
1179+
1180+
<iframe src="http://ghbtns.com/github-btn.html?user=dimsemenov&amp;repo=magnific-popup&amp;type=watch&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="170" height="30"></iframe>

website/index.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ <h1 id="logo-title">Magnific Popup</h1>
1515
<div>
1616
<h2 class="intro">Magnific Popup is a responsive jQuery lightbox plugin that is focused on performance and providing best experience for user with any device (Zepto.js compatible).</h2>
1717
<div id="header-links">
18-
<a href="documentation.html">Documentation</a> &middot; <a href="https://github.com/dimsemenov/Magnific-Popup">GitHub</a> &middot; <a href="wordpress.html" class="wp-version-link" data-mfp-src="#mc_embed_signup">WordPress plugin</a> &middot; <a href="#mfp-build-tool" class="mfp-build-tool-link">Build tool</a>
18+
<a href="documentation.html">Documentation</a> &middot; <a href="https://github.com/dimsemenov/Magnific-Popup">GitHub</a> &middot; <a href="wordpress.html" class="wp-version-link" data-mfp-src="#mc_embed_signup">WordPress plugin</a> &middot; <a href="#mfp-build-tool" class="mfp-build-tool-link">Build tool</a> &middot; <a class="smashing-link" href="http://coding.smashingmagazine.com/2013/05/02/truly-responsive-lightbox/">How it was made</a>
1919
</div>
2020
</div>
2121

@@ -81,8 +81,9 @@ <h2>Updates</h2>
8181
<h2>Please spread the word if you find the plugin useful</h2>
8282
<div id="buttons-row">
8383
<a id="tweet" rel="nofollow" href="https://twitter.com/intent/tweet?text=Magnific%20Popup%20-%20responsive%20lightbox%20plugin&amp;url=http%3A%2F%2Fbit.ly%2Fmagnificpopup&amp;via=dimsemenov">Tweet!</a>
84-
<a id="like" rel="nofollow" href="http://www.facebook.com/sharer.php?u=http%3A%2F%2Fdimsemenov.com%2Fplugins%2Fmagnific-popup%2F%3Futm_source%3Dfb%26utm_medium%3Dsocial%26utm_campaign%3Dmfp">Like? Like!</a>
84+
<a id="like" rel="nofollow" href="http://www.facebook.com/sharer.php?u=http%3A%2F%2Fdimsemenov.com%2Fplugins%2Fmagnific-popup%2F%3Futm_source%3Dfb%26utm_medium%3Dsocial%26utm_campaign%3Dmfp">Like!</a>
8585
<a id="gplus" rel="nofollow" href="https://plus.google.com/share?url=http%3A%2F%2Fdimsemenov.com%2Fplugins%2Fmagnific-popup%2F%3Futm_source%3Dgplus%26utm_medium%3Dsocial%26utm_campaign%3Dmfp">+1</a>
86+
<iframe src="http://ghbtns.com/github-btn.html?user=dimsemenov&amp;repo=magnific-popup&amp;type=watch&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="155" height="30" style="transform: translateY(8px);-moz-transform: translateY(8px);-webkit-transform: translateY(8px); margin-left: 9px;"></iframe>
8687
</div>
8788
</div>
8889
<script>

0 commit comments

Comments
 (0)