• Register
Welcome to the in5 Answer Exchange! This a place to get answers about in5 (InDesign to HTML5) and make requests.

Customize Appearance of Back/Next Arrows

0 votes
Is it possible to control the size of the back/next arrows? For a particular project, I'd like for them to be smaller.
asked May 28, 2015 in how_to by homeboy (150 points)
edited Jul 31 by justin
    

1 Answer

0 votes
 
Best answer

Yes, you can create your own .css file and attach it using the Resources section of the in5 dialog. Here are 2 different CSS code snippets that will shrink the arrows to half size for example...

A) This ways is a bit easier but it relies on the browser supporting CSS transforms.

.anythingSlider-in5 .arrow a {
    -ms-transform: scale(0.5, 0.5); /* IE 9 */
    -webkit-transform: scale(0.5, 0.5); /* Chrome, Safari, Opera */
    transform: scale(0.5, 0.5);
}
 
OR
 
B) This way involves a bit more tweaking, and is also not supported in IE8 due to the background-size property.
 
.anythingSlider-in5 .arrow a {
    background-size: 200% auto;
    height: 34px;
    margin: -34px 10px 0;
    width: 34px;
}
 
It may be easier to make tweaks to the CSS while you're testing using the browser inspector.

 

answered May 28, 2015 by justin (114,320 points)
selected Feb 18, 2016 by justin
...