Auto shuffle graphics

[Lynnzer]

I want to make my site shuffle the photo's on it automatically depending on the width of the browser window.

A site that does this is shown here. http://gndesigngroup.es/en/linea/zeila-cocktail/

My own site (still in build) is here and the pages I want this reshuffle are the picture gallery ones of thr individual collections.

I can't see any useful css code on the source code of the site exampled so don't really know how to do this.
Any ideas guys?

[gwpriester]

Welcome to TalkGraphics

I moved this thread to Xara Web Designer Chat.

Resize your large images to a thumbnail size. In Website Properties > Image Properties, check Pop-up Photo and set a image Width.

Click Options. Check Show Gallery Browser Controls and check Automatically start slide-show and set a time between slides.

[Lynnzer]

Welcome to TalkGraphics

I moved this thread to Xara Web Designer Chat.

Resize your large images to a thumbnail size. In Website Properties > Image Properties, check Pop-up Photo and set a image Width.

Click Options. Check Show Gallery Browser Controls and check Automatically start slide-show and set a time between slides.

Thanks for that but it isn't the same as I want. I have the pop-sizes chosen already and I have no problem with that.
Best take a look at the site I pointed to to see what I mean.
For instance a picture gallery of, say, 5 pictures per row on a page width of 1000 pixels but when the window width decreased to something less or more, the pictures move aroiund to fill each row accordingly. So if the 1000 pixel width is reduced to 800 pixels the 5th picture on the row would drop down to the next row, ad infinitum.

Here's the example link again

[Ben.Moses]

Hi Lynnzer,
The way that website works is by extending the page length to accommodate for the additional rows created from reducing the width. This wouldn't be possible as Xara is a WYSIWYG web design program, everything you design in Xara is exported exactly the same down to the pixel, so it wouldn't be able to change the length of the page. You can use Responsive Web Design to have multiple variants, so when you decrease the width your shown a thinner variant that is longer and has the 4 columns instead of 5. For more information on Responsive Web Design See the Xara support articles, http://support.xara.com/index.php?/K...ive-web-design

[Lynnzer]

Thanks Ben. So it's learn css or leave it well alone eh?
Maybe this is something that could be incorporated into a future release though.

[Acorn]

Thanks Ben. So it's learn css or leave it well alone eh?
Maybe this is something that could be incorporated into a future release though.

Nothing to do with CSS. Xara from v.10 has built in the capability to design additional pages that are presented for differing viewport widths.
These designs are called Variants. So to move from a 4-column to a 2-column, you have a normal and a narrow design. You could over-design and have a width for five all the way down to one, if that rocked your boat. Mot would be happy to see it landscape and portrait on their tablet so aim for two designs.

Acorn

[Acorn]

I have deleted this similar posting:

Apologies if there's another query like this from me as I thought I'd already posted one but can't find it.

So, what I want is a picture gallery that shuffles the pictures to fit the window width. Not by a resize of the photo's, just moving them to show in the chosen width of the web-page.
I mean like this. A page from my suppliers website
You can see on the above page that if you decrease the page width the pictures automatically shuffle to the next line down (or up) to compensate.

My own site still under construction is at www.northern-fashion-agency.co.uk and I want the same effect on my picture galleries.

Is there a way to do this by insertion of code or something please.

In passing, you already have a Variant set up for www.northern-fashion-agency.co.uk; it is still the default template design.
Perhaps you didn't spot the design page has two tabs?

Acorn

[Lynnzer]

I have deleted this similar posting:



In passing, you already have a Variant set up for www.northern-fashion-agency.co.uk; it is still the default template design.
Perhaps you didn't spot the design page has two tabs?

Acorn

Yeah, I'm working on the variants at present.
I must say that Xara is a good programme though. A lot better than my previous Frontpage programme that I thought was easy as well.