Slider Maker

Add Layer - Jssor Slider Maker


1. Add layer

In layers pane, click toolbox item and select layer type to add a layer.


2. Set layer properties

Select the layer and set properties of the layer.



Text Layer (A layer contains plain text or customized html code)



Image Layer (A layer represents an image)



Panel Layer (A panel layer is a container which contains child layers)



Layer Properties

Width: [Required]

Height: [Required]

Border: [Optional]

Background Color: [Optional]

Background Image: [Optional]

Link: [Optional]

Blend: [Optional]

Describes how a layer should blend with the layer's direct parent and the layer's background and layers below the layer. Default value is 'normal'.


Font (Text Layer): [Optional]

Font Weight (Text Layer): [Optional]

Font Size (Text Layer): [Optional]

Text Color (Text Layer): [Optional]

Italic (Text Layer): [Optional]

Text Align (Text Layer): [Optional]

Line Height (Text Layer): [Optional]

Letter Spacing (Text Layer): [Optional]

Padding (Text Layer): [Optional]

Image (Image Layer): [Optional]

Extended Properties

Extended properties are advanced properties for user to customize display or behavior of a layer.


Class Name: [Optional]

Custom class name of a layer, which controls display of a layer by user defined css.


Pointer Events: [Optional]

Indicates a layer can become the target of mouse events. The value is 'all' by default which is interited from parent layer.
The value 'none' instructs the mouse event to go "through" the layer and target whatever is "underneath" that layer instead.


Transform Origin: [Optional]

Specifies the center point (x y z) to transform (rotate, scale, skew) a layer, default value is '50% 50% 0'.


Backface: [Optional]

Backface visibility of a layer, default value is visible.


Overflow X: [Optional]

This property specifies whether to clip content, render a scroll bar, or display overflow content of a layer, when it overflows at the left and right edges. Default value is visible.


Overflow Y: [Optional]

This property specifies whether to clip content, render a scroll bar, or display overflow content of a layer, when it overflows at the top and bottom edges. Default value is visible.


3. Set initial motion properties

Motion properties of a layer are dynamic properties.
By default, a layer has a motion point at the begining of timeline. There may be multiple motion points in the timeline. That's to say, motion property value can change from time to time, it leads layer animate in the timeline.


Select the begining motion point of a layer to set initial motion properties of the layer.