Results 1 to 5 of 5

Thread: Captions not changing on Parallax slider

  1. #1
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    264
    Thanks
    71
    Thanked 2 Times in 2 Posts

    Default Captions not changing on Parallax slider

    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
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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:

    Code:
    <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:

    Code:
    <!--[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:

    Code:
      <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.
    Last edited by jscheuer1; 02-05-2017 at 08:32 AM.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    264
    Thanks
    71
    Thanked 2 Times in 2 Posts

    Default

    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
    Code:
      <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.
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. The Following User Says Thank You to jscheuer1 For This Useful Post:

    dmwhipp (02-05-2017)

  6. #5
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    264
    Thanks
    71
    Thanked 2 Times in 2 Posts

    Default

    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
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

Similar Threads

  1. Problem with Parallax Slider
    By dmwhipp in forum Dynamic Drive scripts help
    Replies: 6
    Last Post: 03-25-2016, 05:21 PM
  2. Responsive Parallax Slider
    By mlegg in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 03-25-2016, 01:58 AM
  3. Parallax Slider - Full Width
    By dmwhipp in forum Dynamic Drive scripts help
    Replies: 3
    Last Post: 08-11-2015, 05:08 AM
  4. Parallax Slider Question
    By NoobsterD in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 08-06-2015, 06:41 PM
  5. Embed Video in Parallax Slider?
    By dmwhipp in forum Dynamic Drive scripts help
    Replies: 4
    Last Post: 11-25-2014, 10:45 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •