Captions not changing on Parallax slider

[dmwhipp]

1) Script Title: Parallax Slider

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ider/index.htm

3) Describe problem: I love this script and use it on multiple sites. I had just finished installing and customizing on a new template, when I noticed the captions weren't changing from slide to slide as they should. So I uninstalled and reinstalled it multiple times, but still can't figure out the problem. I am putting this on a responsive page so I've been going over the code to see if I can find a conflict, but I haven't found that yet either.

Here is the page: http://dshhattorneys.accountsupport.com/template2.html

Any help would be appreciated.
Deborah

[jscheuer1]

There could also be other problems. But I see that, in the page's source code, there's another version of jQuery added after the scripts for the slider -

Slider scripts and its css file:

<link rel="stylesheet" type="text/css" href="/js/parallax/parallaxslider.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="/js/parallax/jquery.velocity.min.js"></script>
<script type="text/javascript" src="/js/parallax/jquery.touchSwipe.min.js"></script>

<script src="/js/parallax/parallaxslider.js" type="text/javascript">

/***********************************************
* Parallax Slider- (c) Dynamic Drive (www.dynamicdrive.com)
* Please keep this notice intact
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

</script>

<script type="text/javascript">

var firstparallaxslider=new parallaxSlider({
	wrapperid: 'myparallaxslider', //ID of DIV on page to house slider
	displaymode: {type:'manual', pause:3000, cycles:2, stoponclick:true, pauseonmouseover:true},
	delaybtwdesc:  100, // delay in milliseconds between the revealing of each description layer inside a slide
	navbuttons: ['/js/parallax/arrowleft.png', '/js/parallax/arrowright.png', '/js/parallax/up.png', '/js/parallax/down.png'], // path to nav images
	activeslideclass: 'selectedslide', // CSS class that gets added to currently shown DIV slide
	orientation: 'h', //Valid values: "h" or "v"
	persist: true, //remember last viewed slide and recall within same session?
	slideduration: 1000 //transition duration (milliseconds)
})

</script>

Then just after that:

<!--[if IE]><link rel="shortcut icon" href="/img/favicon.ico"><![endif]-->
  <script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
  <script type="text/javascript" src="/js/jquery-ui.min.js"></script>    
  <script type="text/javascript" src="/js/modernizr.js"></script>
  <script type="text/javascript" src="/js/responsee.js"></script>
    <!--[if lt IE 9]>
      <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
    <![endif]-->

It's the highlighted that overwrites the initial jQuery script used by the slider. This apparently kills the velocity script, as velocity is no longer defined.

First thing to try would be to get rid of the highlighted line. Hopefully the other code that uses jQuery 1.8.3 can get by fine with version 1.11.0. If so - all done! If not, let me know but leave it up with just the 1.11.0 jQuery so I can have a look at it that way. Oh, and what does the 1.8.3 version do? Looks like it enables something called responsee.js, right? As long as both that and the slider work after removing the reference to:

  <script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>

Then we're all set. If not, we will have to do some detective work, and I will have to know just what responsee.js does when it's working as expected.

Edit: Looks like it should work. Did here in limited testing - let me know. Don't forget to refresh the page and/or clear the cache to see results.

[dmwhipp]

Hi John,
When I first started using the Responsee framework to try and learn responsive design, I was curious about all of the scripts being loaded, wanted to know if they were necessary, and wondered whether or not they were all necessary for the responsive framework to work correctly. I contacted the creators and here is their response:

1. responsee.js - this file is necessary for the proper functioning of the responsive navigation, the responsive tabs, the custom form placeholder and to indicate an active item in the navigation.
Without this file the framework isn't working correctly.

2. jquery-1.8.3.min.js - this file is main jQuery library. Without this file the framework isn't working correctly.

3. jquery-ui.min.js - this file enables animation in navigation. This file is not necessary but we strong recommend this file.

4. modernizr.js - please read this article modernizr.com - this file is not necessary.

5. owl.carousel.js - this file is necessary for carousel. If yout don't use carousel, this file can delete.

6. html5.js - read this article github.com/aFarkas/html5shiv - this file is necessary only for the proper functioning for older browsers

7. css3-mediaqueries.js - this file is necessary only for the proper functioning for older browsers

I've removed

  <script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>

Now the slideshow is working properly on my laptop and iPad, but it is NOT working on my smartphone (Samsung Galaxy S5). http://dshhattorneys.accountsupport.com/template2.html On my phone, it loads the first slide and captions, but doesn't load any other slides.

[jscheuer1]

I have no s5 to test on but my browsers have s5 emulation and it works fine in those. I'm thinking that, as often happens on smart phones, the older version of the page is cached. To test that theory, try copying the page to one with a different name, say - template3.html, and load that version into the s5. If that works, then it was just cached. Otherwise, I'm not sure what to suggest, but I'll think of something.

[dmwhipp]

Hi John,
I renamed the page and uploaded it, but that still didn't work. However, it did work on my son's Galaxy, so I quickly learned how to clear my phone cache and reboot and that did the trick! So glad since the Responsee framework uses Owl Carousel which doesn't appear to have support any longer (the Owl Carousel website is a goner).

I did get the Slippry slideshow up, running, and customized in relatively short order: http://dshhattorneys.accountsupport.com/slippry.html. I'm just not as familiar with it and haven't messed with styling the captions yet, but it's an option for future builds.

Thanks once again!
Deborah