• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 430
  • Last Modified:

Jquery Slider

Looking for a solution to creating a jquery DIV slider with bottom buttons that can call the slides when clicked. So far we have created the content and arrows to scroll left and right but we also want users to be able to click the bottom black package buttons to select the appropriate slide.
Plan-Pages.zip
0
fadercreep
Asked:
fadercreep
1 Solution
 
Michel PlungjanIT ExpertCommented:
Even better is to create a JSFiddle.net with only the absolutely necessary code to show the issue. A 181KB Zip file is not promising
0
 
Jens FiedererCommented:
Good advice, although in this case the actual basic.html file included was really quite small...most of the bulk was in the included jquery support files, which could have been linked off the web rather than included.

Anyway, I think all it takes is onclick events:

    <div id="planbuttons">
    	<img src="images/basicplan_thumb.png" alt="WaveDirect Basic Plan" onclick="$('#plan_slider').cycle(0)"/>
        <img src="images/standardplan_thumb.png" alt="WaveDirect Standard Plan" onclick="$('#plan_slider').cycle(1)"/>
        <img src="images/ultraplan_thumb.png" alt="WaveDirect Ultra Plan" onclick="$('#plan_slider').cycle(2)"/>
        <img src="images/entertainmentplan_thumb.png" alt="WaveDirect Entertainment Plan" onclick="$('#plan_slider').cycle(3)"/>
        <img src="images/ePLUSplan_thumb.png" alt="WaveDirect Entertainment PLUS Plan" onclick="$('#plan_slider').cycle(4)"/>
    </div> <!--Closes planbuttons-->

Open in new window


Essentially this is just using information from the goto samples on http://jquery.malsup.com/cycle/faq.html
0
 
fadercreepAuthor Commented:
Thanks for everyone's help on how to post projects in the future, also Great to see Jens answer to the question regardless of my posting zip files. Thanks for getting me on track! This is why I love experts exchange!
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now