We Keep Coding

Why doesn't my jQuery/JavaScript work in Safari?

I'm developing a website for a client, and although all jQuery/Javascript code works fine in Chrome (e.g. floating navbar, and smooth scroll when you click a navbar item), none of it seems to work in Safari?
I've looked at other questions on StackOverflow, and the only advice I've found is to use a HTML validator, because Safari can be iffy like that.
Although I'm in the process of doing that now, I have a feeling it's something deeper, because most of the HTML issues revolve around obsolete center tags.
At the moment, the site is up at: http://www.grahamcafe.net23.net/Padre/index.html

If I breakpoint at http://stats.hosting24.com/count.php I do not get the error. It document.writes a new jQuery
Try this in script.js
var myWrite = document.write;
document.write = function(str) {
;// ignore document.write
}
to stop your hoster from wrecking your page with their horrible script. You get what you pay for I believe.
It assumes Safari allows replacing document.write with an anonymous function

Cross-browser gallery compatibility, .load() issue?

I'm having some cross-browser compatibility problems.
Instead of put all the code here, I link you the page:
http://www.smaskerando.org/spettacoli/disney.html
In the bottom left part of the page, you can see a small gallery. When you click on the small thumbnails, a larger version of the photo appear in the middle of the screen. It works perfectly on Chrome, but it has problems on Firefox and Internet Explorer.
I think the problem is in these lines:
$(".galleryPopUp").load(function(){
var width = $(this).width()
var height = $(this).height()
if (width < height)
{$(this).css("width","25%")}
else
{$(this).css("width", "50%")}
})
They seem to not recognize the .load() method.
You can get the full code from the page looking for the file "script.js" and going to line 379 (the full gallery function).
Have you got any idea how to solve it?
Thank you all!

You should put your own script under jQuery call, cause you're using jQuery and may don't be avaible when you call it.
It's not maybe the cause, but is an goo practice.
I tried on Chrome and it llooks like works OK.

Ok, I found the solution! And I hope it could help.
The problem wasn't about the .load() . It was about the div I was trying to append. Actually is a really small difference I didn't notice till now:
Firefox and Internet Explorer automatically quoted the value of the attribute src of the image I was inserting. Chrome doesn't do it. So to be more clear:
This was what happened on chrome:
... <img src="img/example.jpg" />
And this was happening on firefox/IE:
... <img src=""img/example.jpg"" />
So obviously firefox didn't recognize the image. I solve this problem using jQuery migrate and adding this line if ( $.browser.mozilla ) and I removed the "" from the string when using firefox.
Thank you anyway for the quick answers!

Site makes web browser suddenly stop and turn off in some IE browsers

the site link is http://www.kosfan.com (korean site)
in some web browser (IE 7 and 8), the site suddenly stop and turn off in not only main pages but also other pages.
i have tried to find the reason why it happens, but i cannot.
i thought that possible reasons are javascript error, onload(ready) function and ajax-load something like that.
is there any one who can solve this problem? help me!
thanks :)

I've had similar issues with IE and JQuery - it is definitely bug of the IE browser. You need to go debug the code and find where the crash happens. In my case it was a problem of accessing an element by id in JQuery way. When I replaced $("#id") for document.getElementById it stopped crashing :-)

JavaScript parent page redirection from iframe

I need to implement parent page redirection from iframe. I know that it is impossible to do in different domains due to browsers security.
However I found that links have target attribute and tried to use it in the following way:
someLink
It works fine if I click this link manually, but I couldn't find cross-browser solution to simulate it using JavaScript.
document.getElementById('testParentRedirect').click();
This works fine in IE, however Firefox and Safari don't know click function :).
I tried to work with jQuery, but for some reason they don't simulate click event for links.
(see following post)
I couldn't find any appropriate solution on Stack Overflow.
Maybe someone could help me in it. I will appreciate it. :)

You can do this in javascript to exit a frame:
window.top.location = "http://google.com";

You can try
top.location.replace( "http://google.com" );
in javascript to "escape" from the frame.
Edit: Using replace is slightly nicer, changed my answer to use that.

Object Focus problem with Safari and Chrome browsers

I have the following javascript being called to request a focus when page is loaded.
This code works 100% OK with Firefox and IE7, but Chrome and Safari do not seem to move the focus at all. How to make it work with all browsers?
document.getElementById("MyFlashFile").focus();

It took me hours searching the Internet, but finally I found a solution that works on the lastest versions of IE, Firefox, Chrome and Safari.
The following code solves the problem for good:
<head>
<script type="text/javascript" src="swfobject.js"></script>
<script>
function setFocusOnFlash() {
var f=swfobject.getObjectById('myFlashObjectId');
if (f) { f.tabIndex = 0; f.focus(); }
}
</script>
</head>
<body onload="setFocusOnFlash()">
This example assumes the flash is embedded using the SWFObject library. If not, you should set the f variable to the Object or Embed tag which holds the flash movie.
Edited on 5 May 2012: Well, unfortunately it seems that the tabIndex workaround no longer works for all combinations of browser (Chrome/Safari) and operating system.
For instance, currently Chrome 18 on Windows fails.
See the link below, provided by Christian Junk, to get the status of the problem's resolution.

Unfortunately there is no way to ensure that you can set focus to a flash file that works in all browsers. IE and Firefox have solved this problem (for the most part), but Chrome and Safari are both based off of Webkit which does not have a solution.
If you ever notice on YouTube or other video / flash site that the first thing you see is something to entice you to click on the player, that is due to this problem.
One developer came up with a clever workaround, but it does involve adding some ActionScript to your flash file, this can be a pain in the ass if you are building a generic player.
Gary Bishop: Fixing Firefox Flash Foolishness
Another sort of solution is to set your wmode to opaque. I've heard this works in some situations, but will screw up cursors in text areas. I haven't had much luck with this either, but you can give it a shot.
You can find more information about the no focus bug on bugzilla.

It seems that there is a bug in Chrome:
"window.document.getElementById('swfID').focus() not working for flash objects"
http://code.google.com/p/chromium/issues/detail?id=27868
I've tried to find a workaround but I was not able to find one ;(
Regards,
Christian

In addition to Cláudio Silva answer , you need to set wmode="opaque"

Ensure this code is being called after the entire page has been rendered. It's probably being called above the HTML it refers to, so the element will not exist yet.
Various JavaScript frameworks have utilities to tell you when the DOM is ready.