问题
How to control two slides with same prev, next button? When I click on prev/ next button I want both the slides to move.. How to achieve this functionality?
JS Bin: http://jsbin.com/osogig/1/edit
$(function() {
$("#slides, #slides1").slides({
generatePagination : false,
height : 50
});
});
<div id="slides">
<div class="slides_container">
<div>sample text 1</div>
<div>sample text 2</div>
<div>sample text 3</div>
<div>sample text 4</div>
</div>
<a href="#" class="next"> Next </a> <a href="#"
class="prev"> Prev </a>
</div>
<div id="slides1">
<div class="slides_container">
<div>
Lorem ipsum dolor sit amet <br /> Lorem ipsum dolor sit amet <br />
Lorem ipsum dolor sit amet <br />
</div>
<div>
Lorem ipsum dolor sit amet <br /> Lorem ipsum dolor sit amet <br />
Lorem ipsum dolor sit amet <br />
</div>
<div>
Lorem ipsum dolor sit amet <br /> Lorem ipsum dolor sit amet <br />
Lorem ipsum dolor sit amet <br />
</div>
<div>
Lorem ipsum dolor sit amet <br /> Lorem ipsum dolor sit amet <br />
Lorem ipsum dolor sit amet <br />
</div>
</div>
</div>
回答1:
Append this to #slides1:
<a href="#" class="next"> Next </a><a href="#" class="prev"> Prev </a>
Add this to your CSS:
#slides1 .next,
#slides1 .prev { display: none; }
Add this to your JS:
$('#slides .next').click(function() {
$('#slides1 .next').click();
});
$('#slides .prev').click(function() {
$('#slides1 .prev').click();
});
http://jsfiddle.net/samliew/4JjMC/
来源:https://stackoverflow.com/questions/14743445/slidejs-how-to-control-two-slides-with-same-previous-next-button