Anything Slider and IE9

[newagekat]

Hello:

I’m using anything slider for the first time. I love it! I have installed v1.4 in my CMS (cms made simple). I have it working in firefox, safari, and chrome. It even works in IE 9 BUT only in compatible mode. In standard mode it appears that the slides are stacking. I can generally figure out how to fix IE css issues, but javascript is, well, beyond my understanding.

I have tried to add the meta tag to force compatibility mode ( ), no go.
i have removed the first slide, the movie, still no go.
i have even removed this line from the head:
onSlideComplete : function(slider){ // alert(‘Welcome to Slide #’ + slider.currentPage);
}
still nothing.

We are approaching a launch and i need this resolved. the website in question is : http://tc2.ca/cmsms/

any suggestion is highly welcome. This is most URGENT. thank you.
kp

[Mottie]

Hi KP!

Download the newest version of AnythingSlider from here. It includes an “anythingslider-ie.css” file that is loaded using conditional comments (see the wiki documentation on how to set it up)

[newagekat]

Sorry Mottie:
i made an error. i’m using v1.7.26 and i do have the IE stylesheet inside conditional comments. I’m also using the cs-portfolio theme – which i’ve modified a little.

[Senff]

I’m not sure that the issue is on a CSS level. Inspecting the code in IE9 shows that there is no code applied to/around the UL with id “slider”, so I’m thinking there’s something wrong with the jQuery call.

Any reason why you load both 1.5 and 1.7.1 of the jQuery libraries?

[newagekat]

sometimes it’s tricky because some scripts never get upgraded so you have to have more than one jquery call. but i only see one call to jquery1.5 the line above is a function call i think.

as to conditional comments mine reads:

is this stylesheet for any IE version or just for 7 and older?

[Mottie]

The IE stylesheet is meant for IE7 and older.

I’m not really sure what you are asking now…

[newagekat]

Mottie:
i got the slider working. you can view it at http://tc2.ca I added the fade option to the function call and the relevant css. if you notice, the first time it loads, the first slide repeats. any idea how to smooth that out?

[Mottie]

Hi @newagekat!

It looks like you are using version 1.7.26 of the slider. The newest version (1.8+) of AnythingSlider has a [`mode` option](https://github.com/CSS-Tricks/AnythingSlider/wiki/Appearance-Options#wiki-mode) that you can set to `fade` to cross-fade between panels. Also you won’t need to use the FX extension.

If you are stuck using that older version, the set the FX option named `stopRepeat` to `true`. See [this page](https://github.com/CSS-Tricks/AnythingSlider/wiki/FX) on how to set that option. But basically you’ll end up with this code:

.anythingSliderFx({
// target the entire panel and fade will take 500ms
‘.panel’ : [ ‘fade’, ”, 300, ‘easeInCirc’ ]
},{
// FX options
stopRepeat : true
});

[Author]

Posts