I've been working on an iphone version of my site, and though their
are lots of comments re: animation on mobile safari, I actually don't
think it's all that bad (maybe it was previous versions, I'm on v.2).

I have an iphone like UI working fairly well, where the user can
select something and the screen shifts left, and then shows the
selection.
Back and forth work ok, except that for some reason before it goes
shifts left, it scrolls to the top of the screen.

I'm not sure why this is happening.
 a demo is at http://zifimusic.com/v2/mobile

what the code does is
1) animate the list left -330px (off the screen)
2) add the appropriate content to a div (which was offscreen is now
onscreen) called div#selectedshow
3) scroll to the top of div#selectedShow so that the selected item is
always at the top of the screen
4) click the x (it will be a back button eventually) to reverse this
process

the code is
[code]
 $('div#holdForecast').animate({marginLeft : "-330px"},1000)
        var getShowid=$(this).attr('id');
        var selectedShow=$(this).html();
        var htmlThis = '<li class="show">'+selectedShow+'<span
class="holdMap"></span><\/li>';
        $('div#selectedShow').html(htmlThis).show().css
({"position":"absolute", "top": topVal});
                $('div#selectedShow li.show').addClass
('selectedShow').removeClass('show');
        var targetOffset=$('li.selectedShow').offset().top;
        targetOffset=targetOffset-14;
        $('html,body').animate({scrollTop: targetOffset},5);
        var topMenu='<div id="topmenu"><a class="back"><?php echo
$closeImg; ?><\/a><\/div>';
        $('li.selectedShow').prepend(topMenu);
[/code]

I don't see anything in there that says (scroll to the top), and yet
it seems to do that.
Is there a better animation sequence I should be using?
Should I chain these better than I have?

Thanks
Pete

Reply via email to