How to add a new webview on horizontal swipe event in iPhone?

I am working on project where I have to add a feature of horizontally swipe to move new story. Actually I have achieved this by adding java script to the uiwebview content. But the problem is it changes suddenly (means without animation).

What I want is the feature that is used by most of the article reader apps in iPhone i.e when swipe slowly, we can see the previous story and the next story. In other words if we swipe horizon开发者_开发技巧tally from right to left then a new webview is loaded with next story, and when we come to center of the screen both of the view can be seen( the previous story and the next story), and when we move to left then the next story is loaded completely. As we can see in scroll the both the cells of table(previous and next) can be seen if scroll down and up.

Please tell me any logic for it or any code for it.

This is a lazy loading case. So, we will have only 3 webviews added to the scrollview, at any given point of time, called as previous story webview, current story webview and next story webview.

Initially, the current story webview will be loaded with the current story (say story number 1). Since, there cannot be story number 0, our previous story webview will be empty and will be at the left of the current story webview, not visible to the user. Similarly, our next story webview will be loaded with the next story (story number 2) and will be at the right of the current story webview.

MOVING TO NEXT STORY CASE:

Suppose, if user wants to move to next story, this should not be a problem for us, as we have already kept our next story loaded in the next story webview. BUT, after we move to the next story, it should become the new current story, the current story should become the new previous story. And what about the previous story?

The previous story webview is useless here. The previous story webview becomes useless here, and it is wise to make it the new next story webview, loading it with the next story (story number 3) and also moving it to the right of the new current story webview.

This process should repeat if user keeps moving to next stories.

MOVING TO PREVIOUS STORY CASE: This case works exactly the opposite of the above case. In this case, the old next story webview becomes useless and we should make it the new previous story webview, loading it with the appropriate previous story number.

A good simulation of the case would be something like this.

P -> previous webview, identified with tag 1 C -> current webview, identified with tag 2 N -> next webview, identified with tag 3

Initial case:

P(0), C(1), N(2)

MOVING TO NEXT: OLD-P(0), NEW-P(1), NEW-C(2)

Since, OLD-P(0) is useless, we make it the NEW-N(3)

So, we have P(1), C(2), N(3)

i.e. we loaded the OLD-P with the next story and placed it right after NEW-C.

UPDATE:

Steps to rearrange the story webvies:

As we discussed, we don't have to create new story webviews. We just have to reposition the useless story webview, with the useful story webview.

So, in case of moving to next stories:

The previous story is free/useless.

1. Assign frame of previous story to the right of new current story.

2. Set next story tag as current story tag, current story tag as previous story tag and the useless previous story tag as current story tag + 1.

3. Load the previous story with the new next story (i.e. current story + 1)

If you have understood the above 3 steps, you can write the steps for moving to previous stories. They are just opposite to them.