Content Comparison

...

Overview

• Carousel is a collection of images that are displayed one at a time

• The Carousel component displays a series of images in a single container, A carousel slider is a slideshow of photos.A carousel allows multiple pieces of featured content to occupy an allocated amount of space. The purpose of the carousel is to display photos or other media files in the form of a slideshow. This is either automatic or manually controlled

• It can slide automatically at a certain motion, speed, and time. Or users can navigate through it manually. It enables a site to display multiple media files without taking up too much space. Carousels prove effective at keeping visitors interested in the page content. The images and videos lead the visitors to explore and learn more about the website

• Adding visuals such as photos and videos to a website gets visitors’ attention. It also enhances the user experience. For a design or photographer website, placing images in sliders or photo carousels makes them more interactive

• An image carousel is a container (slideshow) of images or info that users can select by clicking a button that directs them forward or backward in the slideshow. An image carousel makes a website more interactive by enhancing the user experience

• A carousel is a robust and versatile component that can be an image slider, an item carousel, to an onboarding experience. It is touch-enabled making it especially smooth to use on mobile

...

• with image indicators and a control button below the image panel

• Carousel displays one image at a time, and you can select particular images by clicking the indicators

• Carousel provides a header and descriptive text that displays below the image

Attributes

Model

• Models are used to display content in the layout

• Typically used for record creation or editing, as well as various types of messaging

• A Model needs to be added when you perform any action in an event, refer to this link Models

  • In the carousel, you can bind the multi-record model to display the data and images

  • Model will add

    Image Added

  • Create New Model: You can either choose the model from the list or you can create the new model by clicking on “Create New Model“ Option for your table

Head Line

• The fields you created are displayed in the Head Line attribute and the data which you saved in that field is displayed below the carousel image

• Click onHead Line

• Selects the field from the dropdown menu

  Image Added

Source

• In the source, attribute you save the image URL which is displayed as carousel images in the carousel component layout

• Click onSource

• Selects the Source from the dropdown menu

  Image Added

Description

• In the Description attribute, you can give a description of the carousel images which are displayed below the Head Line attribute.

• Click onDescription

• Selects the Descriptionfrom the dropdown menu

  Image Added

Auto Scroll

• If the checkbox is true then in preview mode it automatically scrolls images

...

• In Previewmode

...

Scroll Duration

• You can set the duration for scrolling images in the carousel

• e.g. if you set 3 scroll duration then in preview mode the next image scrolls after 3 seconds

...

Animation Type

• In Carousel, you can use customized animation effects for slide transitions using the animation types

• Animated Carousels are way more engaging than still carousels

• There are five types of animation

  • Slides: A slide transition is how one slide is removed from the screen and the next slide is displayed during a presentation

    Image Added

  • Scale: An animation that controls the scale of an object. You can specify the point to use for the center of scaling

    Image Added

  • Fade: Fade animation is used to change the appearance and behavior of objects over a particular interval of time

    • It will provide a better look and feel for our applications

      Image Added

  • Flip: Flip animation is viewed by viewing successive images in a quick motion so that they seem to form a sequence

    • A flip animation is a simple type of animation created by viewing successive images so quickly that they seem to form a sequence

      Image Added

  • Jack In The Box: A Jack In The Box, Creates a transition effect by imitating a popular joke toy movement

    • It starts with the central fading in and continues with shaking from one side to another

      Image Added