asked on

JS content hover not working in Safari

Hello,
In Safari, I'm not getting the content hover to display in the three bottom modules of this page. All I can see are the headers. They are showing up in Firefox and Chrome on OS 10.6. I haven't checked IE yet...

http://sandbox.intrepidrealist.com/ah-juice

When I used the Console I got this error:

ReferenceError: Can't find variable: initialize

This is the code I'm using in the head:

jQuery(document).ready(function() {
			jQuery('.d1').contenthover({
				    overlay_background:'#fff',
				    overlay_opacity: 1
				});
			 });

Open in new window

Oddly, enough, when I go to a different page and then return home, the modules show up.

Thanks!

kingshez

I think the under laying problem with Safari browser and jQuery is the variable support in the jQuery API for Safari - try removing the jQuery variable from your script as following - and use $ sign - that should work for Safari and all other browsers.

$(document).ready(function() {
                  jQuery('.d1').contenthover({
                          overlay_background:'#fff',
                          overlay_opacity: 1
                        });
                   });

After your first test - your may also want to replace the second line - jQuery('.d1').contenthover({

by

$('.d1').contenthover({

Hope it helps,

Thanks.

David S.

The error message is referring to this:

<body onload="initialize()"

Open in new window

Simply remove the onload attribute from which ever template file it's in.

try removing the jQuery variable from your script as following - and use $ sign - that should work for Safari and all other browsers.

The "$" is just a shortcut/alias for "jQuery". Changing that will not fix a completely unrelated error. However, it doesn't hurt to reduce unnecessary characters from a script.

Alicia St Rose

ASKER

That totally worked! Don't know why that was there. Came with the parent theme I'm working on. Hopefully, something else doesn't break!

Got to keep the jQuery instead of $ because of conflicting script libraries in Wordpress.

Alicia St Rose

ASKER

Aaaarghhh!
I thought this worked. Checked it and closed Safari. Upon opening Safari and going to the site the modules are still not showing up.
I've requested to reopen this question.

Thanks, everyone!

ASKER CERTIFIED SOLUTION

David S.

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Alicia St Rose

ASKER

Worked like a charm!
Thanks Kravimir!