About this page
This page explain about the JavaScript code generated by the UI editor.
About Automatic Evaluation (Auto Eval)
Each line of jQuery code generated by the UI editor begins like this:
/*!kz:autoeval*/
This autoeval
comment ensures that the code in its line will be executed immediately.
To avoid conflict between DOM creation and applying the Variation, remove these autoeval
comments from the lines. Without the autoeval
comment, the lines will be executed after DOMContentLoaded
events.
How UI editor uses jQuery method
Edit HTML
The Kaizen Platform UI editor uses the following codes to edit HTML:
Edit Style
To set a style
, the UI editor uses:
Edit Attributes
To adjust Atributes, the Kaizen Platform UI editor uses:
- attr(properties): to change value and addition of Attributes
- removeAttr(name): to delete Attributes
Set a background image
To set a background image, the Kaizen Platform UI editor uses css({ "background-image": "Image URL" })
.
Add jQuery coding
Adding jQuery coding is possible. Find out more at jQuery reference.
Removing Elements
Drag to move
This code explains the relative position from a parent element:
$("#element").css({"position":"relative","left":"150px","top":"69px"});
Insert images
Use the append(content) method and insert the<img>
-tag.
Insert HTML
- before(content): insert HTML into the previous element
- after(content): insert HTML after this element
- prepend(content): insert HTML at the top of the element
- append(content): insert HTML at the end of the element
- wrap(html): wrap an element in HTML
- wrapInner(html): wrap a child-element in HTML
0 Comments