treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Using more sliders of the same style below each other.

  • Is it possible to make those sliders styled like "slider1" appear one below the other?
    It only works if i use the different designed sliders, so 1 and 2 in this example, but not if i only want my sliders to be all styled like "slider1": The second one of them is not even appearing there, it is simply showing all the pictures that should be inside the silder.
    I was symply trying to copy and paste this part of the code:

    (I deleted the names of the pictures cause Im not sure if the one who needs my help for his website would like to find them over here.)


    			
    <!-- AnythingSlider #1 -->

    <ul id="slider1">

    <li><object width"369" height="450"><img src="img/___.jpg" alt=""></object></li>

    <li><object width"680" height="450"><img src="img/___.jpg" alt=""></object></li>

    <li><object width"680" height="450"><img src="img/___.jpg" alt=""></object></li>


    </ul>




    I have not changed a lot about the page.css and so on, and everything works fine as long as there is only one "slider1". Where could the problem be?

    Hopefully you have some suggestions.
  • Oops sorry:
    At the end of the code, of course
    <!-- END AnythingSlider #2 -->
  • Of course it's possible but you haven't given us enough information.

    A link would be best or re-create the structure (HTML/CSS/JS) in Codepen

    I'm assuming that you have given the 2nd slider an ID of 'slider2' and updated the css to style it the same as 'slider1'?
  • As Paulie D said - a CodePen would be super helpful so we can figure the problem.

    However, my gut says that if you're trying to run two sliders and one isn't working then it's related to the Javascript in your probably only setup to run #slider1 rather than both.