problem with JS generated gallery

[thomyerk]

hello!

I had the following problem: I use a gallery loader (instafeed) and therefore (maybe because the javascripts dont like each other) my li elements dont get their parameters (inside bx-wrapper > bx-viewport > bx-slider). they are just plain li elements,

what should i do? I tried to reload the slider after it loads, but that wont help (but its the only way i can make the li-s get their parameters, I tried the following:

$(document).ready(function(){ $('#gallery').bxSlider({ captions: true, pager: false, preloadimages: 'all', mode: 'fade', speed: 1000, onSliderLoad: function(){ slider = $('#gallery').bxSlider({ captions: true, pager: false, preloadimages: 'all', mode: 'fade', speed: 1000,}); slider.destroySlider(); slider.reloadSlider(); } }); }); any help or suggestion, thanks!

[farkasimre]

Hi!

If you use this script for instafeed http://instafeedjs.com/ - try ti initialize the bxslider after the instafeed is loaded - has the "after" function

var userFeed = new Instafeed({
    .......
    after:function(){
        //here insert the slider intialization script
    }
});
userFeed.run();

[thomyerk]

hello! yes i am trying to use that...my problem is that if I want to reload the gallery (to add more photos) it is put another wrapper and viewport to the code, instead of replace the refreshed gallery . My goal is that the gallery can refresh itself when it reached the end of the currently loaded pictures - I think it is now only loads about 18-20 pictures (I tried to load all the images first, but it takes a very long time, it was with after: function() { userFeed.next(); } . OR to load all the images in the background, while the user can browse the first X pictures, while the others loading continuously. heres my full code, the searched tags are read from a file http://pastebin.com/qA5SSNVK

[thomyerk]

I can manage to add new items to the gallery, but they are simple

elements (as I templated them in Instafeed), and bxslider didnt handle them...I will be happy if they will appear in the slider somehow http://pastebin.com/cB51k4n4

[farkasimre]

http://bxslider.com/examples/reload-slider - have you tried this one - to reload slider after the new element is attached?

You can try to load on each slide a new image - ex default are loaded 20 images, user view image 1 - > slide to image 2 on bxslider onSlideAfter event you load the 21st image and after that call reloadSlider ( i haven't tried in, not sure if the reloadslider will roll back the slider to initial , first image )

[thomyerk]

köszi imre :) I've tried the following, only with a separate button: $('#reload-slider').click(function(e){ var slider = $('#gallery').bxSlider(config); feed_<?php echo $v; ?>.next(); slider.empty(); slider.reloadSlider(); });

the problem is that it will replace the slider with a new one, with the next 20 elements, which could be good, but all the elements will be plain list elements, and the navigation controls did not scroll them - it seems like the slider didnt recognized them, dont want to include them in the slider. I think in my case reloadslider function is a bit broken. also, the viewport and wrapper didnt destroyed as it supposed to be, the slider just puts another combination of them INSIDE the previous (see the picture of my third post)

[thomyerk]

also, another problem is that instafeed loads blocks of images, so I dont know how to load only one picture with it, but thats a minor problem. main problem is with reloadslider

[thomyerk]

another update: I've tried to count the slides in the slider, and they are now appearing, and getSlideCount also count them as slides, but I cannot reach them with prev or next buttons...for the first time i got 11 slides counted, and after a refreshSlider(), the new ones are not included in the carousel, just the first 11.... (and the structure is the same as in the 3rd post, wrapper+viewport inside a wrapper+viewport etc)