AnythingSlider + fadeIn + Safari 5 issue

[ivand]

Good morning fellas.

I’ve integrated anything slider into a wordpress site ive been working on.

I used display:none; to hide the div containing the slider in order to avoid a FOUC. (yeah, i know is not an optimal solution)

and then used this

to show the div right after the window has loaded. the effect works on chrome + ffx + opera. but in Safari Mac and IE9 cant get it to work.

The url is http://tubolsillo.do (is a work in progress)

Thanks in advance!

[Mottie]

Hi Ivand!

That page has some serious issues… just from my quick look I found:

• Extreme page loading issues! I’m not an expert, but I don’t think it’s a good idea to add a twitter, google and facebook button to every post on the page – I counted 12 sets. If you do, then limit the number of posts showing. Please!
• The same ID is used multiple times (e.g. #video-area & #player)… most browsers ignore all but the first, which is probably why your fadeIn doesn’t work.
• The slider markup is borked… just from the view source I see

and

[ivand]

whoa. I knew i was letting some things slip by, but i didn’t realize it was so bad. this project has gone through a LOT of changes (something worthy of a clients from hell book i think) which has f***ed up my development process.

I checked and solved those issues but i still can’t get it to work on Safari. Weird.

About the social icons, is something the client wont give up about. So i was thinking to maybe implement some kind of lazy loading, to hide the ones that are not in the viewport at load time

[ivand]

Also, is there anyway to hide completely the start/stop button and maintain slideshow functionality?

[Mottie]

Hi Ivand… I haven’t had a chance to find the problem, but you can just not build the start/stop button buildArrows:false – the slideshow will still work.

[ivand]

Thanks so much Mottie, but right now I have yet ANOTHER issue (im sorry)..

Im using the video plugin and now I cant get the slideshow functionality to work again.

here’s the link http://tubolsillo.do/

[Mottie]

Hi Ivand! I just visited the page and the slideshow automatically started playing. What part was not working?

[ivand]

in my case (win7+chrome) it doesnt starts sliding until i hover my mouse on the slide area.

also, cant get the thumbnavigation to center under the slide area :/

Im getting

jquery.anythingslider.js:137 Uncaught TypeError: Object #

[Mottie]

Hmm, that is weird… I’m not sure but I think the problem may be that the entire slider is being faded in while it is initializing. Maybe try using a callback function in the fadein, like this:

$(document).ready(function(){

$('#video-slider').fadeIn(800, function(){

$('#show-slide').anythingSlider({

theme           : 'cs-portfolio',

easing          : 'easeInExpo',

autoPlay  : true,

buildStartStop  : true,

enableStartStop : true,

pauseOnHover  : true,

delay   : 5000,

buildNavigation : true,

animationTime   : 500,

addWmodeToObject: 'opaque'

});

});



});

As for the thumb navigation, I don’t even see it on the page.

[ivand]

I tried that to no avail :/

Could it be related to the javascript errors?

I feel like im bothering you too much, gonna have to send at least a beer your way.

[Mottie]

Oh yeah… duh I didn’t even look at Firebug. It looks like you have jQuery 1.4.1 on the page and I recently modified the code by using the delegate function which is only supported in jQuery 1.4.2+ but honestly you should update to jQuery 1.6.2.

I don’t know what to make of the other error on the page.

[ivand]

Thanks! apparently updating jquery solved the issues.

[nadineb]

I also have an anythingslider problem, but is it me, or is there nowhere to post a new discussion topic here? I can’t find it.

[Mottie]

Hi nadineb!

It’s the big blue button at the top of the right column “Start a New Discussion”.

[Author]

Posts