Scrollable Frame overlays

You can create a scrollable frame that lets users scroll to view more content. For example, you can create a cooking page with a list of ingredients and a set of instructions. Rather than turning to the next page to see the full set of ingredients or instructions, users can swipe to scroll.

By default, the initial view for scrollable content is the upper-left corner of the container frame. However, you change the initial view so that it’s based on the location of the content frame.

You can add nearly all interactive overlays to scrollable frames. Only slideshows are not supported. The previous method of creating scrollable frames using layers is no longer supported.

Adobe recommends

Have a tutorial you would like to share?

Advanced Scrollable Frames

Johannes Henseler
See how Johannes used scrollable frames to create a fadeout effect.

Scrolling Content Video

Colin Fleming
Colin’s video shows how easy the new scrolling content technique is and that scrolling content now may include hyperlinks and buttons.

Creating Scrolling Pull Tabs

Colin Fleming
Colin’s video shows how to use scrollable frames to create slideout tabs, or sliding trays.

Create Scrolling Slideshows

Terry White
Terry shows how to create scrolling slideshows that can contain pictures, captions and even movies.

    Create simple scrollable images

    1. Select an image.

    2. Drag the bottom or right selection handle to crop the frame.

    3. In the Folio Overlays panel, select Pan Only.

    When users view the folio, they can either drag vertically or horizontally to scroll the larger image within the smaller frame.

    Create scrollable frames

    You can create a scrollable frame by cutting a frame or group of objects and pasting it into a smaller container frame.

    1. To make a frame that scrolls vertically, create a content frame and a container frame.

      • The content frame can be a text frame, an image, or a group of objects.

      • You can include any interactive object except a slideshow in your content frame. Either add the interactive objects to the text frame as anchored objects or group interactive objects with other objects.

    2. Move the content frame to its inital view area in relation to the container frame.

      If you use the default settings, the content frame will align to the upper left corner of the container frame. However, you can use the document location of the content frame to determine the initial view.

    3. Select the content frame, and choose Edit > Cut.

      To avoid erratic behavior, make sure that the content appears in the layout page area, not the pasteboard.

    4. Select the container frame, and choose Edit > Paste Into.

      Note: When you paste the content frame into the container frame, any button with an MSO state action loses its action. Select the button and add the action again. (The selection buttons in the toolbar are especially useful for selecting hidden buttons. The Layers panel is another way to select nested objects.)

    5. With the container frame still selected, open the Folio Overlays panel. Click the Scrollable Frame tab, and then specify these options.

      Scroll Direction
      Choose Auto Detect to determine the scroll direction based on the height and width of the container frame and content frame. If the heights of the frames are the same but the widths are different, the content scrolls only horizontally. To make sure that the content scrolls in only one direction even if the container frame is narrower and shorter than the content frame, choose Horizontal or Vertical. Choosing the Horizontal and Vertical option offers the same behavior as Auto Detect.

      Scroll Indicators
      Select Hide if you don’t want scroll bars to appear when scrolling.

      Initial Content Position
      Select Upper Left to align the content frame to the upper left corner of the container frame as the initial view. Select Use Document Position to use the location of the content frame as the initial view.

    Note: See the DPS Tips app to view examples of scrollable frames, including nested scrollable frames and pullout tab effects.

    Forums

    		 More

    Blogs & Twitter