Code

Discussion on Backslider - Fullscreen Background Image Slider

Discussion on Backslider - Fullscreen Background Image Slider

Cart 884 sales

flGravity supports this item

Supported

This author's response time can be up to 5 business days.

171 comments found.

1000 Dank flGravity Hat alles funktioniert. :-)

1000 Thanks to flGravity, everything worked. :-)

Hallo :-) ich möchte gerne den dunklen Hintergrund (wrapper_bg.png) hell haben, doch dieser ist nicht zu 50% Transparent…. wie bekomme ich dieses hin?

HI :-) I would like to have bright the dark background (wrapper_bg. png), but I do not is there to 50% transparent. . . How do this this?

Thommy

Hi, there is bs-overlay.png file in images/ folder, that is responsible for image overlay pattern. You can replace it with any semi-tranparent png.

Fantastic solution. Works as described. Lots of options. Unbelievable support. Had a single question and heard back in less than 24 hours. Highly recommended.

Hi, I downloaded about 24 hours ago. The downloaded version doesn’t load the images in IE9 (and IE8 ). However, when I copy the code used for the preview on codecanyon that pulls images from Flickr, it does work fine in IE. Any clues please on what needs to be changed?

Hi! Actually I need to have a look on what you did already. Could you give me URL to the page with backslider?

Hello flGravity

I´ve purchased your file and implemented easy, but now i need some help to use on my project. I need to when i click on a link, the backslider goes to a specific image A and stop, and when i leave that link it continues to slide the rest of the images except the image A

can you please help?

best regards

Gonçalo Silva

Thanks for purchasing my plugin! Please contact me privately and we will discuss this further.

Just wanted to write a review here. I’d mentioned a handful of wishlist items for the backslider and spotted a few issues. flGravity worked in all of our requests and resolved all of the issues. Support and communication was timely and professional. The slider works and looks beautiful. Definitely recommended.

Love this slider – great job! I am having an issue with this playing correctly on an iPad. When the page opens up on the iPad, the last image in the slide list is displayed and the timer doesn’t work.

Have you come across this issue before?

I don’t have ipad. Do you check on my preview?

Your demo works on the iPad. I’m not sure what I am missing or what has changed since adding it to my site.

Check the markup and backslider init code.

Hello! How can I use the mode ‘timer’ and previous/next navigation arrows together? Thanks for help!

Hi, you need to set mode to “timer” and then attach some click handlers that would sent custom events with jQuery trigger(‘backslider’,[action]) method to the plugin. This is explained in documentation.

here’s another issue. when the aspect ratio of the background image is greater than browser window, a strip of the black background is visible along the bottom until the window is resized. this is chrome v22 on mac osx.

video: http://screencast.com/t/kcXyR2KvhO9Z

That won’t be a problem and I appreciate the update. Regarding the current slide ID, could you provide a bit more explicit instructions? The following code alerts “1” as the total number of slides, despite having 4 slides loaded. And I’m not sure how to pull the current slide “index” number.

// function to display total slides and current slide beforeSlide: function(){ var total = $(this).length; alert(total); var index = ??; alert(index); }

Please let me know about the timing issue as well. Thanks much.

You should use afterSlide callback, and here is example:

afterSlide: function(n){
          console.log((n+1) + " of " + $(this).find('.bs-slides li').length);
 }

Also please contact me using mail form so I could have your email to send updated files that include fix for “trigger() and timeout” problem.

You may redownload “Backslider” from codecanyon. I have just uploaded update that fixes timer problem.

here’s a critical issue. the slider intermittently won’t load when using the image preload option set to true. here’s a video showing the slider not loading, then loading on refresh, then not loading on refreshing again. chrome Version 22.0.1229.79 on mac osx.

video: http://screencast.com/t/yTHvmKXQ8qG

could you please let me about this?

very happy with this so far. a couple of things:

1. i’m using the timer mode and am trying to display the number of the current slide such as 1/6… 2/6… 3/6… i can easily capture the total number of slides by counting the children within the .bs-slides list. however, there doesn’t seem to be an easy way to keep track of the currently active slide. it’d be great if there was a publicly available variable that i could display.

2. while using timer mode, when the user manually changes slides via the publicly available trigger $(’#bs0’).trigger(‘backslider’,’previous’); the script should reset the timerDelay. right now i have the timerDelay set to 8 seconds and if the user manually changes slides at 7 seconds, then the newly active slide will only be visible for 1 second before the slide is changed again. instead, the timerDelay should be reset to 8 seconds after the slide is changed.

here is the implementation i’m working on: http://www.ds.restaurantconnectinc.com/

thanks, ted

I’m having compatibility issues with IE8 sometimes does not load the plugin, what to do?

Can you give me a link to your site?

Hi!

Awesome plug-in, but I’m having a bit of trouble loading images properly. It seems like the bottom is being cut off. Any thoughts?

Thanks! This may happen if browser’s aspect ratio differs from image proportion. For example when you have portrait image but browser window is in landscape mode. In this case backslider tries to stretch image to browser width, however the result will be that bottom part of image will be cut off.

Hi,

Thanks for that. I understand. Next question … :)

I need to queue the transition animation on certain slides so that I can show multiple slides at once. For example, trying to mimic this kind of behavior:

page load slide 0 fade in click next slide 0 – no change slide 1 – fade in click next slide 0 – no change slide 1 – fade out slide 2 – fade in click next slide 0 – fade out slide 2 – fade out slide 3 – fade in click next slide 3 – no change slide 4 – fade in ...

and so on, with the previous button reversing the order above. Any thoughts?

Thanks! Brian

You should write your own code for this. Maybe using backslider callbacks or API to move between slides.

Hi ftGravity, this plugin looks excellent!

Question though—

Will it be possible for me to apply this as a background to a div?

For example, I don’t want the whole background to change, but the background of the header section.

If it’s possible, how would I go about it?

Best, Stepan

I guess it will work. Just tried to change backslider div properties in Firebug to some fixed size and relative position and it still works fine.

I am also having issues in IE, but I am running IE9 . It actually does show up, but if I go to another page within the site, and try to go back to the page (homepage) with the Backslider, it doesn’t load even if I refresh(F5) the page… unless I switch to Compatibility Mode. And while in Compatibility Mode, if I repeat the same process and go back to the homepage, I then have to turn Compatibility Mode off in order to get it to show again. The site is lesueurinteriors.com

I checked and the file is UTF -8.

Please help, otherwise works FLAWLESS , and very fast! Great job!!

Can you disable preload on lesueurinteriors.com and then let me know?

Ok, I have it disabled. But please let me know when you’re done looking at it due to the fact that the slider does not function correctly and the site is live.

ok. You may revert the changes and enable preload. But please contact me privately as I seem have found a problem, but right now cannot tell what had caused it.

Hi, I love this script!

The only issue I have is that it does not work on IE8 for some reason.

http://misowebdesign.com/testlab/nav/hot-iron/

It works on ff, safari, and chrome, but not on ie.

Can you tell me what I am doing wrong?

Thanks,

Hi,

do you see any errors in ie? Also how does the problem look like?

Regards,

I recall I had client with such problem some time ago, where FF and Chrome were fine, but in IE my plugin didn’t work. The reason was that page encoding was not UTF -8 and ie was giving error about some unknown symbol or variable. So please ensure that editor that you use saves page in utf8.

Hi, I love this script!

The only issue I have is that it does not work on IE8 for some reason.

http://misowebdesign.com/testlab/nav/hot-iron/

It works on ff, safari, and chrome, but not on ie.

Can you tell me what I am doing wrong?

Thanks,

I would really like to know how to grab the current slide’s ID or image name and trigger something through the beforeSlide and afterSlide methods. I can see in your code there is a currentSlide mention in the private functions, but I do not know enough about javascript to pass that as I need to into the API . Thanks in advance for your quick reply!

Hi,
beforeSlide() and afterSlide() callbacks accept one argument. This argument is the current slide index, starting with 0. Also you can check slide index using following jquery code

$(’.backslider > .bs-slides’).children(‘li:visible’).index()

Hi, Very nice plugin. I’ve add it into wordpress and made the nggallery to work with it. It work like a charm… One question – I use the controls option with the slide effect. so now if I click the next button there is a slide to the left effect. Can I alter something so if i click the previous button it will slide to the right? Thanks

Glad that you like my plugin! The “slide” option works only in one direction. Maybe in some update I will make it work in both directions.

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey