timl
Posts: 3
Joined: Mon Dec 08, 2014 2:07 pm

Centering Gallery

I have created a gallery using the editor and using the Gallery: Basic White example. I am dynamically choosing the images and they are all the same height, but varying widths. Since the gallery is left aligned, it looks a bit off. Is there a simple way to center the gallery instead of having it left aligned?
User avatar
RoadRash
Posts: 8249
Joined: Tue Jul 15, 2008 6:43 pm
Location: Fredrikstad, Norway
Contact: Website

Re: Centering Gallery

Try adding this to your highslide.config.js file:

Code: Select all

hs.align = 'center';
Hilde
Highslide Support Team

Overview of my Highslide sample pages: RoadRash.no
MisterNeutron
Posts: 440
Joined: Sun Aug 18, 2013 11:20 am

Re: Centering Gallery

The other default setting that causes odd effects when your images are a mix of aspect ratios is the "fixedControls" value. You will probably want to set it to false:

Code: Select all

hs.addSlideshow({
	// slideshowGroup: 'group1',
	interval: 5000,
	repeat: false,
	useControls: true,
	fixedControls: false,
	overlayOptions: {
		opacity: .6,
		position: 'top center',
		hideOnMouseOut: true
	}
});
timl
Posts: 3
Joined: Mon Dec 08, 2014 2:07 pm

Re: Centering Gallery

Thanks for the response. That was already in my config file. Any other suggestions?
MisterNeutron
Posts: 440
Joined: Sun Aug 18, 2013 11:20 am

Re: Centering Gallery

Please give us a link to your site. I think we may be talking about two different things, but without being able to look at your site, I can't tell.
timl
Posts: 3
Joined: Mon Dec 08, 2014 2:07 pm

Re: Centering Gallery

I think you are correct. I think I miss worded it when I said "gallery." I am using an internal server to do some testing to see if this works so it is not publicly available.

I am actually talking about the thumbnails. Since they are in an unordered list when they are shown on a page they do this

thumb1 thubnail2 thumbn1
thumb1 th1 thumb1

those thumbnails center aligned instead of left aligned. I guess as I think about it that really isnt an issue for highslide itself but just a general issue. Any advice is appreciated though.
MisterNeutron
Posts: 440
Joined: Sun Aug 18, 2013 11:20 am

Re: Centering Gallery

Yes, centering stuff is just CSS 101, and doesn't really have anything to do with Highslide JS itself. Taking a typical page that the Editor produces, you can just add this before the closing </head> tag:

Code: Select all

<style>
.highslide-gallery {
     margin: 0 auto;
     width: 600px;
}
</style>
You can use any width you like, of course.

Return to “Highslide JS Usage”