xara web designer 10 free scroll templates

If you would like the parallax effect to be full width:ħ.

Right click on the rectangle and select ‘names’Ħ.

Create a rectangle in size and location required for the parallax ‘window’ (mouse off layer)

To add the image – left click the parallax placeholder press ctrl+alt+shift+A (all at the same time), navigate to the required image, left click on it and press open.Ĥ. Prepare the image you wish to use for the parallax effect and rename the image file name to parallax.jpg. Right click on it and select “Web Properties” (normally bottom of the list),īackground-image: url('index_htm_files/ parallax.jpg') !important Ģ.Create a simple rectangle on the mouse off layer.create a rectangle on the mouse off layer): Update How to create a high resolution parallax in Xara web designer 11ġ. I would like to know if this information is useful and also should I write more howtos. If you like this article write a comment. I hope that this short instruction “how to create parallax in Xara Web Designer” will be helpful. Now you can press the preview icon to see if your parallax works. create a sample text object in the MouseOff layer.add a name to the object: htmlclass = parallax ,.⇒ in Xara Web Designer 11: right click on the rectangle and choose in the menu: “Web Sticky/Stretchy” then select “Full width” option and press ok, ⇒ in Xara Web Designer 10: right click on the rectangle and choose in the menu: “Fill browser width”, ⇒ in Xara Web Designer 11: just create rectangle in the MouseOff layer ⇒ in Xara Web Designer 10: select “pasteboard background” layer, unlock this layer, create rectangle Create a rectangle with the dimensions of the parallax background.paste the above code and click ok and ok.click on it with the right mouse button and select “Web Properties”,.(You don’t have to enter the code from scratch.) This solution has the advantage that placeholder can be easily copied to other documents. paste the below code and click ok and ok.īackground-position: center center !important Ĭreate a simple placeholder and copy and paste the above css code.

Choose in the menu: “Web Page Properties”, Step 1: Add a simple css code to the document. How To create a simple parallax effect in Xara Web Designer.

Xara web designer 10 free scroll templates