Flexslider User Guide Out of Service

Question

I created a slider with Flexslider, and I'm trying to use manualControls: to create a navigation menu, but the links will not work. Here is the code for flexslider and the slider / navigation itself:

FlexSlider:

<script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider({ controlsContainer: ".slidercontainer", controlNav: true, manualControls: ".flex-control-nav li", }); }); </script> 

Slider and navigator:

  <div class="slidercontainer"> <div class="flexslider"> <ul class="slides"> <li>slide1</li> <li>slide2</li> </ul> <ul class="flex-control-nav"> <li>1</li> <li>2</li> </ul> </div> </div> 

Answer 1

Have you fixed it already? If not, the answer is that FlexSlider still has a live event in the plugin, but jQuery did not recommend this.

To fix it; open jQuery.flexslider.js and find / replace "live", replacing it with "on". I really searched for ".live (" and replaced with ".on" to make sure that I only got an event listener. There are 2 entries.

What is it. Works great!

Answer 2

https://github.com/woothemes/FlexSlider/issues/351

It seems that a lot is happening to him.

I use Chrome in the first place, and I did it no matter what on this topic:

http://www.templatemonster.com/demo/42317.html

FlexSlider version he said: jQuery FlexSlider v1.8

But I found a fix for it:

http://wordpress.org/support/topic/chrome-bug-with-flexslider-plugin

The end of the topic, the guy sends a link to another site that he fixed! I posted the following lines below:

Line 34 in jquery.flexslider.js

 slider.eventType = ('ontouchstart' in document.documentElement) ? 'touchstart' : 'click'; 

I replaced it with two lines:

 slider.touch = (( "ontouchstart" in window ) || ( window.navigator.msPointerEnabled ) || window.DocumentTouch && document instanceof DocumentTouch) && slider.vars.touch; slider.eventType = "click touchend MSPointerUp"; 

Hope this helps.

Answer 3

Link example: http://flexslider.woothemes.com/

You can just use the code directly

 $(window).load(function() { $('.flexslider').flexslider({ animation: "slide" }); }); 

Answer 4

I had the same problem: this was due to the fact that touch events appeared on the chrome: // flags page on chrome, after disabling touch events, the arrows and navigation points of flexslider will work.

There are several places in the code where flexslider tries to take into account the iOS error, but completely disables click events in touch browsers that are not iOS.