Slow motion background

[nobbyy]

I think I may now be answering my own question, but from what I see the images are not embedded in the file, but are 'pulled' from a host? Is there a way of embedding them in the xara file or would I need to host them somewhere and point to them within xara?

[Egg Bramhill]

I think you'll need to place them in an image folder and change the css source to point to their url which shouldn't be a big issue. I've quoted the relevant section below (I hope)

Nice find by the way Rob

section.module.parallax-1 {
background-image: url("../img/demo/_small/1.jpg");
}
section.module.parallax-2 {
background-image: url("../img/demo/_small/2.jpg");
}
section.module.parallax-3 {
background-image: url("../img/demo/_small/3.jpg");
}

[nobbyy]

Many thanks Egg, I will give it a go!

[nobbyy]

Hi again

I have gave it a go but cant seem to get it to work - down to my own ineptitude I am sure!

I think that where I am going wrong is that using the code kindly supplied by egg I need to upload the photos into a sub directory of where the site files will be placed?

Ideally what I would like to do is 'embed' the photos in the site so that everything is uploaded in one go - dont know if that is possible?

I have tried using a variant of the code that I think Steve Ledger produced for the full screen slideshows which allow me to use ctrl+alt+shift+A to add the images - I think that the appropriate part of the code is:

"index_htm_files/1.jpg",
"index_htm_files/2.jpg",
"index_htm_files/3.jpg",

So I was hoping that I could combine this with the code supplied by Egg, but as stated I have had no success as yet.

Any thoughts?

[Rob-Xar]

Hi Nobbyy,

Many thanks for your kind words.

Yes, if you select an object and press Ctrl + Shift + Alt + A, then select the images and press ok, it then import that image into your document and will appear in the "filename_htm_files" folder when you export. It will also keep the filename, so change the code to be whatever the filenames are; you could have something like:

"index_htm_files/picture_of_something.jpg",
"index_htm_files/family_photo.jpg",
"index_htm_files/my_first_car.jpg",

Also a note on the Ctrl + Shift + Alt + A feature:

• You can attach multiple files to an object, but need to do them individually.
• If you delete the object you have attached files to, it also deletes the files.
• If you have Designer Pro, you can see attached files in the names gallery under "used files".
• Attached images don't appear in the bitmap gallery.

If you get stuck, send us a PM and I'll look into it. There are some other nicer examples of the parallax scrolling that I'll try when I get a moment.

Thanks
Rob

[nobbyy]

Hi Rob

Many thanks for your swift and very helpful response - I cant wait to try it!

Will let you know how I get on.

Thanks again

Neil

[Drwyd]

Nice one Rob

[mwenz]

Yep, well done Rob.

[Rob-Xar]

Thanks guys, I appreciate it :)

Sorry I probably should of mentioned in the previous post: If the background image is being set by CSS, then you need to use the URL attribute like in the example, so the correct code would be:

section.module.parallax-1 {
background-image: url("index_htm_files/1.jpg");
}
section.module.parallax-2 {
background-image: url("index_htm_files/2.jpg");
}
section.module.parallax-3 {
background-image: url("index_htm_files/3.jpg");
}

Thanks
Rob

[nobbyy]

Hi again Rob - you are an absolute star - works perfectly!!!

Thank you so much.

Neil