magnific-popup


Magnific Popup - Enable zoom animation when using $.magnificPopup.open


I am able to enable the zoom animation when I pre-initialize the Magnific Popup using the syntax below.
element.find('.productImage').magnificPopup({
type: 'image',
mainClass: 'mfp-with-zoom',
zoom: {
enabled: true,
duration: 300, // duration of the effect, in milliseconds
easing: 'ease-in-out' // CSS transition
}
});
However, there are certain places where I need to use the $.magnificPopup.open function to display an image. However the syntax below is giving me a "JavaScript runtime error: Object doesn't support property or method 'is'" error.
element.on('click', function() {
$.magnificPopup.open({
items: {
src: $(this).attr('data-mfp-src')
},
type: 'image',
zoom: {
enabled: true,
duration: 300, // duration of the effect, in milliseconds
easing: 'ease-in-out' // CSS transition
}
});
});
If I remove the "zoom {...}" part from the call, it works fine though but it'd be nice to have the zoom animation when the popup is opened this way. Is it possible at all? Please advise. Thanks!

Related Links

magnific-popup - re-initiate on ajax content
Magnific-popup cancels all requests on open
Magnific Popup fails to work with multiple galleries on a page
magnific-popup open in parent when calling from iframe
Magnific popup iframe closeOnBgClick does not work
Magnific Popup Text Links
Magnific popup - undefined is not a function when parsing markup
Adding onclose method in magnificPopup (that autoloads on pageload)
Popup does not work fine with final tiles grid gallery
Magnific Popup - Enable zoom animation when using $.magnificPopup.open
Magnific Popup appears below page on mobile
Magnific-popup - Source (not showing up again) after closing Popup
Magnific Popup plugin: Preloader not working on iframe
Close, open new magnific popup window via API
Magnific Popup with html5 video
Magnific Popup Gallery: How can I display a counter in an inline type item?

Categories

HOME
tinymce
vmware
webpack-2
baqend
applepay
gorm
ssl-client-authentication
handsontable
windows-azure-storage
usergrid
percona
try-catch
vaadin7
uitypeeditor
ghc
facebook-page
propel
evopdf
ab-testing
dbext
chromium-embedded
pass-by-reference
firebase-crash-reporting
numerical-methods
wpfdatagrid
typo3-6.2.x
buck
jspm
objectanimator
librato
r-raster
tinymce-4
fabric8
yadcf
phonegap
functor
lxd
http-referer
ios5
dartium
bitbucket-pipelines
webix-treetable
uft-api
lumberjack
galen
elmah
powershell-dsc
node-sass
wptoolkit
rainbowtable
termination
nativeapplication
android-cursor
spring-mongodb
lync-client-sdk
sonarlint-vs
static-ip-address
nxt
bstr
gstreamer-0.10
holder.js
sigabrt
bgp
fadeout
ideamart
mono-embedding
web-controls
modalpopup
dd
camanjs
gadt
internet-connection
jquery-layout
doskey
marmalade
hyprlinkr
meteor-velocity
viadeo
ccss
tidy
blending
easy-install
rabl
lcs
browser-detection
chrono
ohm
libc++
krl
imac
mozilla-prism
jquery-ui-droppable
perfect-hash
meego
data-driven

Resources

Mobile Apps Dev
Database Users
javascript
java
csharp
php
android
MS Developer
developer works
python
ios
c
html
jquery
RDBMS discuss
Cloud Virtualization
Database Dev&Adm
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App