Chrome/safari issue with Orbit slider

JavaScript
1

Hello folks! I’ve been attempting to implement a new jquery slider into my site. I’m sooo close but it seems to have a problem in webkit browsers. Works fine in firefox and ie9

Here is my site
This is the slider i’m using

I think the problem has to do with the noconflict function. The site is built on Magento which uses the prototype library. Added this jQuery.noConflict(); to the end of my jquery file.

I’m currently calling the plugin like this

<script type="text/javascript">    
jQuery(document).ready(function($) {
     $('#featured').orbit({
    });	

});
</script>

Any help would be greatly appreciated, I am at my wits end.

2

My webkit-based web browser gives a 404 error on this file:

http://www.februaryson.com/preview/skin/frontend/default/hellosonar/images/header-bck.png
3

Hey Paul, thanks for the heads up. The CSS was specifying an image that didn’t exist so I removed it. Still can’t get the slider to work in chrome or safari, any ideas?

4

It looks like there are two possible solutions.

One is to remove the 1px width and height from the featured element.
Another is to remove the display:hidden from #featured and div.orbit

The real question has to be though, since it works fine on the creators site, what are you doing on the page in terms of CSS that’s causing the problem.

5

Cool, I’ll try that.

I didn’t change anything from the original file I downloaded. My best guess was that it wasn’t playing nice with the prototype library

6

Shall we stop guessing and find out? What happens when the parts that rely on prototype are removed?

7

So I took out the 1px X 1px from the featured element. It looks correct now, its just not pulling in the images.

Good call, I’ll remove the prototype code and see if the slider works. Unfotunately Magento is based almost totally around prototype so I’ll still have to find a way for them to play nicely.

8

If you still get the problem when prototype is removed, you then know that it’s not what you feared.

If the problem is fixed though, you now know exactly where to look for an answer.

Either way, you’re closer to a solution.

9

Thanks again Paul, I did end up removing the prototype library and it was till broken. That narrows it down a lot. Definitely on my way to a solution.

10

That’s great to know. I’ve taken this opportunity to rename this thread to something that’s more related to the issue at hand.

11

I had the same problem. I solved it by replacing “$(document).ready(function()…” with “$(window).load(function()…”

spent two days before finding this solution though