Differences

This shows you the differences between two versions of the page.

--- background_images [2023/07/31 15:58] – ↷ Page moved from playground:background_images to background_images jsmith
+++ background_images [2023/09/02 13:47] (current) – [Background Image Optional Property] jsmith
@@ Line 1: / Line 1: @@
-====== Background Images ======
+====== Project-level Optional Property: Background Images (XOT only) ======
 Background images can be a powerful tool in page design, allowing authors to set the tone for a project or add visual interest to an otherwise plain page. However, it's important to be aware of certain factors when using background images, as they can have an impact on both the usability and overall aesthetic of a page or project.
@@ Line 25: / Line 25: @@
 The **Background **property is pictured below.
-{{:playground:background-property.png|Background Property}}
+{{background-property.png|Background Property}}
-^ Property ^ Description ^ Type ^ Tooltip ^
+^ Property ^ Description ^ Type ^ Additional Information ^
 | Image  | Upload and select an image file to be used as the background image for the page or project.  | Link to Media Browser  | n/a  |
-| Image-scale  | Set the Image-scale {**Stretch to fit**/Crop to fit}. Note that using the **Stretch to fit **option may distort the image, depending on the dimensions of the page when viewed.  | Drop-down  | %%Choose **Crop to fit **to have the background image fill the page but crop rather than stretch the image. Note: this will have no effect in Internet Explorer.%%  |
+| Image-scale  | Set the Image-scale {**Stretch to fit**/Crop to fit}. Note that using the **Stretch to fit **option may distort the image, depending on the dimensions of the page when viewed.  | Drop-down  | %%Choose **Crop to fit** to have the background image fill the page but crop rather than stretch the image. Note: this will have no effect in Internet Explorer.%%  |
 | Opacity  | Set the Opacity of the image. An opacity setting determines the saturation of the image, or how "washed out" it appears compared to the original. Setting the appropriate level of opacity is important to ensure that any text which overlays the image is legible and meets contrast minimums for accessibility.  | Number (0 to 100)  | n/a  |
 | Darkness  | Set the Darkness of the image. This can be helpful in creating sufficient contrast so that light colored text or page elements are easily visible on top of the background image.  | Number (0 to 100)  | n/a  |
@@ Line 39: / Line 39: @@
 The **Title Page** in the **Xerte Online Toolkit **template has a slightly different background property than all of the other page types where the property appears. This is due to the unique nature of a title page within a project.
-{{:playground:background-property-title-page.png|Title Page Background Property}}
+{{background-property-title-page.png|Title Page Background Property}}
 On a **Title Page**, the **Background **optional property includes additional options for setting the following parameters: