Styling caption

Really liking the slider overall, but I'd really like to make some styling changes to the captions.

Firstly, I'd like them UNDER the image, not over the bottom of it. Secondly, though I can find the CSS for the text, I cannot locate where the semi-transparent black BG is coming from. Lastly, I'd like to center the text.

With the Prev and Next arrows, can a mouseover be added so we can change the color of the arrow when moused over?



  • Also noticed that the captions are all pushed to the right when using full width.
  • Another thing. If you click outside the slider images to the left or right there's a very strange "border" goes round the module position. Same thing happens with the Prev or Next arrows - they get a border too on clicking.
  • Hello,

    unfortunately there is no possibility to move description under the image, because of structure of the slider. This option is available in the modern slider layout of the DJ-MediaTools commercial extension.

    You can try to fake description position by playing with width, height and fit image to slide options, but it never will be responsive.

    The outline styles (borders) comes from your template, we didn't add any outline attributes to the slider themes. DJ-ImageSlider support keyboard access (WCAG 2.0 and Section 508) what means that slider is accessible with keyboard and focused elements can contain border (outline from template or default browser outline style for focused elements). You shouldn't remove this border, because some users would not have access to all slider elements and they can leave your page. You can however partially disable keyboard access in the module settings (last param in the first options tab).

    All the other questions are matter of individual styling. You just need to create your own theme and change the styles as you need. Here is the detailed tutorial how to do it

  • It looks like I may have to go to MediaTools. The client (who is picky!) doesn't like how ImageSlider, upon reaching the final image, jumps back to the start. Personally, I think he's nitpicking, but he also pays the bills! He doesn't want it to loop, but, rather, just wants it to just not go any further to the right or left when a user gets to the first or last images. So, say you have 10 images. On image 1, the left arrow would be be unclickable (or better still, greyed out and unclickable) and the same for the right arrow once you got to image 10. (BTW, w will be displaying 5 images at a time). So, if you're showing image 10, you would have to click back to the left to see image 1. Images should advance at 1 image per click.

    Secondly, he wants the arrows (assuming they're able to be clicked to advance images) to have a hover color as well as a normal color.

    Can MediaTools do these 2 things?
  • Hello,

    none of this is possible without customising the DJ-MediaTools. We would be happy to implement it for you if you really need it to work as you described, just contact us via helpdesk and we will estimate it for you.

    DJ-ImageSlider however has an option to stop sliding at the last image, it calls "loop once". It's not exactly what you described, but you can give it a try. We are also planning to add this option to DJ-MediaTools.

Sign In or Register to comment.