gpt4 book ai didi

jQuery slider 想要向我的 slider 添加箭头

转载 作者:行者123 更新时间:2023-12-01 01:43:31 25 4
gpt4 key购买 nike

这是我的 jQuery slider 代码,我想添加向右箭头和向左箭头以在 slider 中手动滑动,我应该做什么?
如果可能的话,请给我示例或代码。谢谢您

	 $(window).load(function() {

var i = 0;

var images = ['../images/mainbanner.jpg', '../images/index.jpg'];

var image = $('#sliderit');

//Initial Background image setup

image.css('background-image', 'url(../images/mainbanner.jpg)');

//Change image at regular intervals

setInterval(function() {

image.fadeOut(1000, function() {

image.css('background-image', 'url(' + images[i++] + ')');

image.fadeIn(1000);

});

if (i == images.length)
i = 0;

}, 3000);

});
`

最佳答案

您可以通过以下链接查看。

Fiddle

 $(document).ready(function(){
$('.sp').first().addClass('active');
$('.sp').hide();
$('.active').show();

$('#button-next').click(function(){

$('.active').removeClass('active').addClass('oldActive');
if ( $('.oldActive').is(':last-child')) {
$('.sp').first().addClass('active');
}
else{
$('.oldActive').next().addClass('active');
}
$('.oldActive').removeClass('oldActive');
$('.sp').fadeOut();
$('.active').fadeIn();


});

$('#button-previous').click(function(){
$('.active').removeClass('active').addClass('oldActive');
if ( $('.oldActive').is(':first-child')) {
$('.sp').last().addClass('active');
}
else{
$('.oldActive').prev().addClass('active');
}
$('.oldActive').removeClass('oldActive');
$('.sp').fadeOut();
$('.active').fadeIn();
});




});

您也可以使用简单的。检查这个Fiddle

关于jQuery slider 想要向我的 slider 添加箭头,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32644398/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com