Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS multiple Anything Slider styling on one page

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #38715
    optimus203
    Member

    Hello everyone. I’m trying to get multiple sliders running on one page, but I’m having problems styling each slider differently from the other.

    The sliders have id’s slider1, slider2, and slider3 respectively. So when I try to style a section of slider2 differently, like:
    #slider2 .anythingSlider-default.activeSlider .anythingWindow {}

    it doesn’t work. Any ideas how to style multiple sliders on one page?

    #105117
    Mottie
    Member

    Hi optimus203!

    Current versions of AnythingSlider have a theme option which allows you to change the style for each slider on a page. Then for the css, just add that theme name to the outer wrapper:

    .anythingSlider-theme1 {}
    .anythingSlider-theme1.activeSlider {}
    .anythingSlider-theme1.activeSlider .anythingWindow {}
    .anythingSlider-theme2 {}
    .anythingSlider-theme2.activeSlider {}

    etc…

    You can’t target the #slider2 ID because it is inside of .anythingWindow

    #105541
    optimus203
    Member

    Perfect! Working like a charm now. Thanks for the help and insight.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.