Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/70.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery 自定义滑块问题_Jquery_Html_Css - Fatal编程技术网

Jquery 自定义滑块问题

Jquery 自定义滑块问题,jquery,html,css,Jquery,Html,Css,我已经创建了自定义滑块,但它不起作用,你们能指导我吗 我的代码: var mwth = 0; var count = 0; var wth = 0; var twth = 0; $(document).ready(function () { $('.box-wrap .box:odd').css("background", "#0C0"); mwth = $('.box-wrap').width(); count = $('.box-wrap .box').size()

我已经创建了自定义滑块,但它不起作用,你们能指导我吗

我的代码:

var mwth = 0;
var count = 0;
var wth = 0;
var twth = 0;

$(document).ready(function () {
    $('.box-wrap .box:odd').css("background", "#0C0");
    mwth = $('.box-wrap').width();
    count = $('.box-wrap .box').size();
    wth = $('.box-wrap .box').width();
    twth = (count) * (wth + 2)

    $('.box-wrap .box').wrapAll("<div class='slider-wp'>");
    $(".slider-wp").css("width", twth);


    for (i = 0; i < (twth / mwth); i++) {
        $(".box-wrap").append("<a href='#'>test</a>")
    }

    $(".box-wrap a").each(function (index, element) {
        $(this).click(function () {
            banner_slide((index) * 990);
            return;

        });
    });

    setInterval(banner_slider, 1000);


});

function banner_slide(i) {
    $(".slider-wp").animate({
        left: "-" + i + ""
    }, 1000).delay(1000);

}

function banner_slider(cnt) {
    twth = (count) * (wth + 2)
    var j = 1000;
    for (i = 0; i <= (twth - 990); i = i + 990) {
        j = j + 1000;
        $(".slider-wp").animate({
            left: "-" + i + ""
        }, 1000).delay(j);
    }
}
var-mwth=0;
var计数=0;
var-wth=0;
var-twth=0;
$(文档).ready(函数(){
$('.box wrap.box:odd').css(“背景”,“#0C0”);
mwth=$('.box wrap').width();
计数=$('.box wrap.box').size();
wth=$('.box wrap.box').width();
twth=(计数)*(wth+2)
$('.box wrap.box').wrapAll(“”);
$(“.slider wp”).css(“宽度”,twth);
对于(i=0;i<(twth/mwth);i++){
$(“.box wrap”).append(“”)
}
$(“.box wrap a”)。每个(函数(索引,元素){
$(此)。单击(函数(){
横幅幻灯片((索引)*990);
返回;
});
});
设置间隔(横幅_滑块,1000);
});
功能横幅(i){
$(“.slider wp”).animate({
左:“-”+i+“
}延迟(1000);
}
功能标题U滑块(cnt){
twth=(计数)*(wth+2)
var j=1000;

对于(i=0;i我假设您的问题是,在单击单个帧的链接时,右侧帧没有设置动画

发生这种情况的原因是,您似乎在一次预先计算滑块的动画数帧

for (i = 0; i <= (twth - 990); i = i + 990) {
    j = j + 1000;
    $(".slider-wp").animate({
        left: "-" + i + ""
    }, 1000).delay(j);
}
您不会遇到麻烦。另外,这将使用您以前为类似任务创建的函数()


为您创建了一个,这样您就可以看到它的运行。滑块本身还远远没有完成(如果卡住了,请随意询问),但这应该可以解决您当前的问题,让您走上正轨。祝您好运!

我假设您的问题是,单击单个帧的链接时,右侧帧没有设置动画

发生这种情况的原因是,您似乎在一次预先计算滑块的动画数帧

for (i = 0; i <= (twth - 990); i = i + 990) {
    j = j + 1000;
    $(".slider-wp").animate({
        left: "-" + i + ""
    }, 1000).delay(j);
}
您不会遇到麻烦。另外,这将使用您以前为类似任务创建的函数()


为您创建了一个滑块,以便您可以看到它的运行。滑块本身还远未完成(如果您被卡住,请随时询问任何问题)但是这应该可以解决你眼前的问题,让你走上正轨。祝你好运!

问题是什么。你想让滑块做什么。问题是什么。你想让滑块做什么。完美的工作谢谢,我能知道你的名字吗完美的工作谢谢,我能知道你的名字吗