Larger click area

It could indeed be convenient to have bigger button sizes, certainly when on a mobile device. The problem however, is that the bigger button area’s may overlap a slide with a URL or even the pagination.

At the moment you can of course work it out for yourself, using a custom stylesheet.

I see, I didn’t think as I don’t use URL or pagination.
What would I do to custom stylesheet to make the area just a strip?
I see it has some strange margin using -20

The images are centered vertically in the slideshow’s container with the ‘top: 50%;‘ CSS value. This will place the top of the button image in the center, but leaves the rest of the button below the center. The ‘margin-top: -20px;‘ pulls the button up half its height so it’s completely centered.

If you want to have buttons from top to bottom, you should do something like this:

.slideshow_container_0 .slideshow_button {
    top: 0; /* Brings the buttons to the top. */
    height: 100%; /* I'm not sure whether or not this works in all versions of Internet Explorer. */
    width: 100px; /* Any width you'd like. */
    background: url('URL to your image') no-repeat;
}

If you’re using the default image, you should probably use something like CSS background-position as well.

I got it

.slideshow_container .slideshow_button {
	top: 0;
	height: 100%;
	width: 39px;
}

.slideshow_container .slideshow_previous {
	background: url('%plugin-url%/images/SlideshowPlugin/light-arrows.png') no-repeat 20px 50%;
}

.slideshow_container .slideshow_next {
	background: url('%plugin-url%/images/SlideshowPlugin/light-arrows.png') no-repeat -19px 50%;
}