Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 220
  • Last Modified:

Jquery Flexslider

This question relates to Q_28515681.html (from earlier today).

Please look at http://rkassoc.org/Davis/wooslider_thumb.html

Notice that the thumbnails underneath are "one off" the larger photos.

If you click on a thumbnail, it takes you NOT to that photo, but the one before.

Two questions:

(1) Why is the thumbnail to larger image relationship off?

(2) Why does the animation stop when a thumbnail is clicked?

html, css & js attached.
wooslider-thumb.html
jquery.flexslider.js
jquery.flexslider-min.js
flexslider.css
0
Richard Korts
Asked:
Richard Korts
  • 6
  • 6
1 Solution
 
leakim971PluritechnicianCommented:
first you don't need both of this files :
<script src="jquery.flexslider.js"></script>
<script src="jquery.flexslider-min.js"></script>

The first one is for development purpose if you need to debug the code
The second file is lighter because minified.
So start by removing one
0
 
Richard KortsAuthor Commented:
To leakim971:

I removed the first (bigger) one.

Still the same.

http://rkassoc.org/Davis/wooslider_thumb.html

If you know of a better slider that can do what I trying to do, please let me know.

Thanks
0
 
leakim971PluritechnicianCommented:
The version 2.2.2 is buggy.
Check here your code with version 2.0 : http://jsfiddle.net/b0aebb9r/

http://flexslider.woothemes.com/js/jquery.flexslider.js
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
Richard KortsAuthor Commented:
leakim971

It works what you put at jsfiddle (the thumbnail connections are correct).

How do I get version 2?

Thanks
0
 
leakim971PluritechnicianCommented:
click on the lin in the bottom of my previous question, that's all I did
0
 
Richard KortsAuthor Commented:
I figured it out (version 2.0).

That works perfectly for the correct thumbnail being hooked up.

Is there a way I can make it so that when I click on a thumbnail, it keeps on the slideshow after going to the selected image?

Thanks
0
 
leakim971PluritechnicianCommented:
until?
0
 
Richard KortsAuthor Commented:
To leakim971

Continuous.

Look at www.davispipe.com for how that works. That uses Flash, which I'm trying to get rid of for the obvious reasons.
0
 
leakim971PluritechnicianCommented:
"continuous" ?
0
 
Richard KortsAuthor Commented:
The slide show repeats indefinitely; it just keeps going.

I thought that animationLoop: true would accomplish that, it seems to UNTIL you click one of the thumbnails, then the animation stops.
0
 
leakim971PluritechnicianCommented:
check this page : http://jsfiddle.net/b0aebb9r/1/

$(window).load(function() {
    $('.flexslider').flexslider({
        animation: "slide",
        controlNav: "thumbnails",
        slideshow: true,
        animationLoop: true
    });
    $('.flexslider ol img').click(function() {
        $('.flexslider').flexslider("play");
    });
});

Open in new window

0
 
Richard KortsAuthor Commented:
That's perfect.

You know this stuff real well.

Thanks!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 6
  • 6
Tackle projects and never again get stuck behind a technical roadblock.
Join Now