Forums

Laughhearty

Hi Everyone! Nice to finally join this community! Okay, so I'm trying to use the Anything Slider, which I've actually used before and had no problem. This time around, I need video functionality. So I'm using additional scripts. I've already got two other dynamic elements on the page requiring their own scripts. If I shuffle the order of the initialization scripts some things stop working, but the Anything Slider never works. I've even deleted all scripts and still it won't work.

My code:

http://codepen.io/Laughhearty/pen/wgzqr

the site:

http://sandbox.intrepidrealist.com/lucidity-fest

Thanks!

margaux

Hi

I had a similar problem on a website I built using Anything Slider with a javascript dropdown menu which I resolved using jquery.noConflict. Try implementing the noConflict variable on one of the other scripts (i.e. not the Anything Slider one). You can set var = j as opposed to var = $j. It worked for me so maybe worth a try.

Mottie

Hi @Laughhearty!

Hmmm, codepen doesn't seem to want to run that code. Something about iframe security. So I moved your code over to jsFiddle and did the following:

1.Removed the var $j = jQuery.noConflict() because you're already using jQuery for other plugins and there isn't any conflict with other libraries.

2.Removed navigationFormatter: formatText because formatText hasn't been defined, so it was just causing an error.

3.Changed $j('#slider1').anythingSlider to jQuery('#slider').anythingSlider because there isn't a 1 in the ID.

You could also combine all of the document ready functions into one as I did in this updated jsFiddle.

Lastly, this script is missing (404 error): css_browser_selector.js

Laughhearty

Thank you so much for the help! Mottie, I implemented your suggestions and it's not working for me locally or remotely. And all the more aggravating, because I can see it working just fine in jsFiddle! Aarghhhhhh!!!

What have I missed?

Mottie

I'm not sure what the problem could be, did you open the javascript console (F12 in most browsers) and look to see if there were any script errors?

Laughhearty

I clicked the console tab in firebug and got no errors. Is this what you're talking about?

Mottie

Well, I guess I'd need to see the live site. I'm not that good at guessing ;)

Laughhearty

Okay, got an answer over at Experts-Exchange from Kravamir (he's a God!) Apparently, without a doctype in jsFiddle an error wasn't showing up. I needed to add change this:

buildComplete: function() {
              splash.find('li.slide-closed div').css('display', 'none');
              splash.find('li.slide-open div').fadeIn();
            },

to this:

buildComplete: function() {
              var splash=jQuery('#splash');
              splash.find('li.slide-closed div').css('display', 'none');
              splash.find('li.slide-open div').fadeIn();
            },

So I got it working, now I just need to make the images fade instead of slide. I've downloaded animate.css, but of course that's not working for me either!

Mottie

Just set the mode option to fade.

treehouse : what would you like to learn today?

Forums

Seem to have javascript conflict with Anything Slider