You may use markupParse
callback, e.g.:
callbacks: {
markupParse: function(template, values, item) {
template.find('iframe').addClass('bad-site-class');
}
}
http://dimsemenov.com/plugins/magnific-popup/documentation.html#api
سؤال
First of all , thanks for the great "Magnific Popup" plugin! I have a beginner' question.
I'm using an iframe
type. I'm showing several types of sites in the iframe , most of them are responsive and takes all the width of iframe. But in some cases when a site is not responsive , i want to add some specific class , in which i set absolute value for width , to the iframe . What is a most proper way to do it?
$.magnificPopup.open({
items: {
src: myUrl,
type: 'iframe',
class: '.bad-site-class' // Is there something like 'class'?
}
});
Thank you and have a good autumn!
(Yoo-hoo , this is 100th question tagged 'magnific popup'! :) )
المحلول
You may use markupParse
callback, e.g.:
callbacks: {
markupParse: function(template, values, item) {
template.find('iframe').addClass('bad-site-class');
}
}
http://dimsemenov.com/plugins/magnific-popup/documentation.html#api
نصائح أخرى
I did something similar by adding a data-modal-class to the trigger element and appending this class to the mfp-wrap wrapping div. You'll need this callback added in the plugin options.
callbacks: {
beforeOpen: function() {
var $triggerEl = $(this.st.el),
newClass = $triggerEl.data("modal-class");
if (newClass) {
this.st.mainClass = this.st.mainClass + ' ' + newClass;
}
}
}
Then add a data attribute with your custom class to the trigger element:
<a href="#SOME-DIV" data-modal-class="mfp-custom-class">Open popup</a>
Before the modal opens it will concatenate your data attribute class to the mainClass option. Hope it helps!