/    Sign up×
Community /Pin to ProfileBookmark

jQuery(document).ready not working in safari

Hi,

I’m using the quite exceptionally used grayscale.js javascript library, which has the power to change entire web elements into grayscale. More info on this javascript plugin can be found here:

[url]http://james.padolsey.com/javascript/grayscaling-in-non-ie-browsers/[/url]

I’ve got it to work on document ready (jquery call), the script is activated on wordpress generated thumbnails. This works excellent in all browsers [B]except[/B] for safari ?

The problem with safari seems to be that it does not load the images correctly before greyscaling them. After hovering them, the (color) images are loaded, and then when removing your mouse it grayscales like it should on page load. For all clearness, i’m using the following script:

[CODE]jQuery(document).ready(function() {
grayscale( jQuery(‘.portfolioimg’) );
jQuery(‘.portfolioimg’).hover(function() {
grayscale.reset( jQuery(this) );
}, function() {
grayscale( jQuery(this) );
});

});[/CODE]

in my <head> section. Note that i’m using a jQuery noconflict solution because wordpress uses scripts that conflict with $.

I have no idea why safari treats the script differently than all other browsers, firefox, IE, chrome, it all works fine!

Anyone any idea how i can make it work? Example here:

[url]http://tinyurl.com/66xc8vv[/url] (url shorten service to avoid SE recognition)

Please don’t mind the messy html structure

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@daanvhauthorJun 22.2011 — I've managed to fix the problem by not using .ready, but setting a timeout which makes the images able to load (for most speeds, so not ideal?)

It does not really matter that the images greyscale after a couple of secs, but it would be nice to make them fadein, instead of just turning grey all the sudden.

Can anyone tell me how to accomplish this? I know how to do it selecting a div, but I don't know how to do it with this script.

Please?
×

Success!

Help @daanvh spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...