-
Posts
-
I previous started this topic and it was closed after another participant responded.
Myself: ” I would like to be able to replace the next and previous arrows in the Advanced Layer Slider with custom .png images. Is this possible? If so where can I swap the images?”
Moderator:”Hi!
The two buttons get this classes respectively:
.ls-nav-prev{ .. }
.ls-nav-next{ .. }Play around with the CSS properties, like background.”
Myself: “That allows me to style the existing arrows (change the arrow color, arrow background color/images etc.) How can I replace the arrow in the square with a completely different .png?”
The other Participant: “it’s not a .png It’s text added with
#top .avia-layerslider .ls-nav-next:before {
content: “”;
font-family: ‘entypo-fontello’;
}I realize that the existing navigation items are not .pngs but I would like to be able to use .pngs instead. Even when I change the existing arrow’s background to an image the image still appears within a box.
try something like this:
#top .avia-layerslider .ls-nav-next:before {
content: “” !important;
background-image: url(“image.png”);
}
#top .avia-layerslider .ls-nav-prev:before {
content: “” !important;
background-image: url(“image.png”);
}Hi!
Thank you for using the theme!
Please use this instead:
a.ls-nav-prev { background: url('PREV IMAGE URL') !important; } a.ls-nav-next { background: url('NEXT IMAGE URL') !important; } #top .avia-layerslider .ls-nav-prev:before, #top .avia-layerslider .ls-nav-next:before { content: '' !important; }Best regards,
Ismael
- The topic ‘LayerSlider previous/next replacement.’ is closed to new replies.