jQuery: iPhone Problems

Question

Hi,

I'm writing a website for iPhone and I use jQuery for image resizing and to scroll to the top.

Both are working in the Firefox on Mac but not on the iPhone. I don't know why because it's the same document and jQuery should be cross plattform...

Any guesses?

Best regards, Sebastian

EDIT:

This is my Code:

var width_max = $('#stiMobiContent').width();

$('img').resize({maxWidth: width_max})

$('a[href=#top]').click(function(){
    $('body').animate({scrollTop:0}, 'slow');
    return false;
});

It although works in Safari on my Mac.

Answer 1

So I thought up a solution that might work:

$('a[href=#top]').click(function(event){
  $('body').animate({scrollTop:0}, 'slow');
  event.preventDefault();
});

Then for your image just change the css to this:

img {width:100%; height:auto;}

That'll will make sure it's always the full width of it's container and the height will automatically match the right aspect ratio.

---

Additionally, I'd like to add that I think the resize method is only called when the window is resized. It's not clear in the documentation though.

Also most browsers have different ideas about how the browser window resize event should be addressed, as they all act a little different. Browser compatibility for max-width seems pretty shaky too.