Develop Reference

call more time jquery plugins (rollerblade)

I want to call rollerblade.js plugin each time a picture is clicked, but it works just once, & didn't work when I changed my HTML code...
I tried to call it in a function and set onclick to my picture, but that didn't work.
$("#show").rollerblade({
imageArray: arrayOfImages,
sensitivity: 5,
drag: true,
auto: false,
edgeStop: false
});

Jquery Infinite Scroll ( IAS ) disable cache

I am using jQuery + IAS to make infinite scroll, the problem is that i do not want cache disabled when making these requests.
Basically this is the URL is accesses to get the next page : http://example.com/flink-link?page=3&ccAC=1&_=1473840893821, I need the _=1473840893821 removed.
I have checked their documentation but found nothing, also i tried adding cache: true but it does not work.
Here is my trigger:
var ias = jQuery.ias({
container: '.movie_w',
item: '.movie',
pagination: '#pagination',
next: '.next',
cache: true,
negativeMargin: 600
});
ias.extension(new IASSpinnerExtension({
src: domain_root_url+'/media/themes/v/images/load2.gif',
}));

Try to add 'cache: true' to the ajax call (JQuery.ajax({})), not in your ias config's variable.
I had the same issue, and that work to me.

magnific popup on JS generated link

I want to use magnific popup on dynamically generated content. I have link generated via javascript and a want to use "iframe" magnific popup with this link.
HTML:
<div id="content">
link
</div>
JS:
$(function(){
$('.mp').magnificPopup({
type: 'iframe',
closeOnContentClick: false,
closeBtnInside: true,
removalDelay: 300,
mainClass: 'mfp-with-zoom mfp-img-mobile my-mfp-slide-bottom'
});
var a = $("a").clone();
a.text('generated');
a.appendTo('#content');
});
live example : jsfiddle
With classic static link everything works well but on generated link it doesn't work. Is there some "refresh" function which will register generated link to magnific popup scope?
I tried to construct new magnific instance after generating the link and it works, but is there some cleaner solution?
Thanks for any response.

Thanks to #MVCDS i figured it out, theres option for this.
$('body').magnificPopup({
delegate: 'a.mp',
type: 'iframe',
closeOnContentClick: false,
closeBtnInside: true,
removalDelay: 300,
mainClass: 'mfp-with-zoom mfp-img-mobile my-mfp-slide-bottom'
});

Ajax/Magnific-PopUp switching content within a popup

I'm having difficulty with Magnific-popup and its AJAX. I want to simply switch the content of a popup if the link is also a popup. This should work by default, but somehow it doesn't.
JavaScript:
$('.magnific').magnificPopup({
type: 'ajax',
ajax: {
settings: null,
cursor: 'mfp-ajax-cur',
tError: 'The content could not be loaded.'
},
closeOnContentClick: false,
closeOnBgClick: true,
showCloseBtn: false,
mainClass: 'mfp-fade',
callbacks: {
parseAjax: function(mfpResponse) {
mfpResponse.data = $(mfpResponse.data).find('.overlay');
console.log('Ajax content loaded:', mfpResponse);
},
ajaxContentAdded: function() {
console.log(this.content);
}
}
});
This works with a link on the standard site. But if there is a link within the popup, it just executes that link, ignoring the Magnific Popup.
My best guess is, that it cant initiate itself because it cant find the selector (like if you use .click instead of .on('click'...)), but I don't seem to figure it out on my own.
Any help would be VERY! apprechiated!
EDIT: Ok I have identified the problem. It seems that the code in functions.js is not available at all within the limits of a popup. Is there a way to make the .js file available in the popup? The only way I made it work is by including the .js file in every file that has a magnific link... but that seems really dirty. Should I load it with the ajax callback or is there another way?
Best regards,
G

pagify.js and reloading / refreshing div

Newbie here, so please forgive me if this is a simple question:
I've got a single-page website using pafigy to hash the urls. When the page is first loaded, it pulls in the "home.html" file into the content div.
The "home.html" content contains scripts (jquery cycle) that need to run when it is loaded into the "content" div of the index page. If I link to the cycle plugin and jquery libraries in the "home.html" page, it loads into the "content" div VERY slowly. So, I load the libraries on the main page and reference them in the "home.html" page.
It works fine when the site is initially loaded; however, if I click another menu item and then try to return to "#home" (either with the back button or with a link to "#home"), it loads the content from "home.html", but doesn't load the cycle plugin.
So, I know I need to refresh/reload the javascript in the "content" div, but I'm not sure how to go about doing that. Any help or words of wisdom would be greatly appreciated.
Here's the pagify script on the index.html page:
<script type='text/javascript'>
$(document).ready(function() {
$('#content').pagify({
pages: ['home', 'food', 'wine'],
animation: 'fadeIn',
'default': 'home',
cache: true
});
});
</script>
And here is the Jquery Cycle script on the home.html page:
<script type='text/javascript'>
$(document).ready(function() {
$('#myslides').cycle({
fx: 'fade',
speedIn: 1000,
speedOut: 200,
delay: 1200,
cleartypeNoBg: true
});
$('#myslides2').cycle({
fx: 'scrollLeft',
speedIn: 700,
speedOut: 500,
delay: 1000,
cleartypeNoBg: true
});
});​
</script>
Again, forgive me if my code is wonky or if I'm doing this completely wrong. I'm trying to learn as best I can and research, but I'm really stuck here.
Also, let me know if you need more code.
Thanks!

I think you have to fire Cycle after you load that page. Perhaps you can achieve that with the onChange option present on pagify.js. It should look something like this:
<script type='text/javascript'>
$(document).ready(function() {
$('#content').pagify({
pages: ['home', 'food', 'wine'],
animation: 'fadeIn',
'default': 'home',
cache: true,
'onChange': function(home) { //wrap 'onChange' in quotes
$('#myslides').cycle({
//Your Cycle Plugin Goes Here
});
}
});
});
</script>
Hope this idea helps.