jquery：为什么我的旋转木马滑块不再滑动？
[英]jquery: how come my carousel slider does not slide anymore?
问题描述
Remake netflix does not slide anymore, the jquery will not function anymore, is this because of my previous code ? 
Remake netflix 不再滑动，jquery 不再起作用，这是因为我以前的代码吗？ I don't see the problem, I did not touch the code from when it was working, but now all of the sudden it's not working ... I used this code-solution: Multiple sliders on one page http://jsfiddle.net/shehovn/Nn4Kz/ hope someone will see what I did wrong ...我没有看到问题，我没有接触它工作时的代码，但现在突然它不起作用......我使用了这个代码解决方案： 一个页面上的多个滑块http://jsfiddle。 net/shehovn/Nn4Kz/希望有人会看到我做错了什么......
How to fix this ?如何解决这个问题？
HTML HTML
<section>
<div class="left" id="links">links</div>
<div class="right" id="rechts">rechts</div>
<div id="head">
<h2>Movies</h2>
</div>
<div class="container" id="test">
<div class="item first" data-childId="1">
<div class="caption">
<div class="title">
<p>Dit is een poes 1.</p>
</div>
</div>
</div>
<div class="item first" data-childId="2">
<div class="caption">
<div class="title">
<p>Dit is een poes 2.</p>
</div>
</div>
</div>
<div class="item first" data-childId="3">
<div class="caption">
<div class="title">
<p>Dit is een poes 3.</p>
</div>
</div>
</div>
<div class="item first" data-childId="4">
<div class="caption">
<div class="title">
<p>Dit is een poes 4.</p>
</div>
</div>
</div>
<div class="item first" data-childId="5">
<div class="caption">
<div class="title">
<p>Dit is een poes 5.</p>
</div>
</div>
</div>
<div class="item second" data-childId="6">
<div class="caption">
<div class="title">
<p>Dit is een tijger 1.</p>
</div>
</div>
</div>
<div class="item second" data-childId="7">
<div class="caption">
<div class="title">
<p>Dit is een tijger 2.</p>
</div>
</div>
</div>
<div class="item second" data-childId="8">
<div class="caption">
<div class="title">
<p>Dit is een tijger 3.</p>
</div>
</div>
</div>
<div class="item second" data-childId="9">
<div class="caption">
<div class="title">
<p>Dit is een tijger 4.</p>
</div>
</div>
</div>
<div class="item second" data-childId="10">
<div class="caption">
<div class="title">
<p>Dit is een tijger 5.</p>
</div>
</div>
</div>
<div class="item third" data-childId="11">
<div class="caption">
<div class="title">
<p>Dit is een aap 1.</p>
</div>
</div>
</div>
<div class="item third" data-childId="12">
<div class="caption">
<div class="title">
<p>Dit is een aap 2.</p>
</div>
</div>
</div>
<div class="item third" data-childId="13">
<div class="caption">
<div class="title">
<p>Dit is een aap 3.</p>
</div>
</div>
</div>
<div class="item third" data-childId="14">
<div class="caption">
<div class="title">
<p>Dit is een aap 4.</p>
</div>
</div>
</div>
<div class="item third" data-childId="15">
<div class="caption">
<div class="title">
<p>Dit is een aap 5.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="16">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 1.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="17">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 2.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="18">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 3.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="19">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 4.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="20">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 5.</p>
</div>
</div>
</div>
</div>
<div class="wall-container">
<span class="close"><i class="fa fa-times"></i></span>
<div class="wall" data-itamId="1">
<h2>Dit is een poes 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="2">
<h2>Dit is een poes 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="3">
<h2>Dit is een poes 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="4">
<h2>Dit is een poes 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak .</p>
</div>
<div class="wall" data-itamId="5">
<h2>Dit is een poes 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="6">
<h2>Dit is een tijger 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="7">
<h2>Dit is een tijger 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="8">
<h2>Dit is een tijger 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="9">
<h2>Dit is een tijger 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="10">
<h2>Dit is een tijger 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="11">
<h2>Dit is een aap 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="12">
<h2>Dit is een aap 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="13">
<h2>Dit is een aap 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="14">
<h2>Dit is een aap 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="15">
<h2>Dit is een aap 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="16">
<h2>Dit is een vlinder 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="17">
<h2>Dit is een vlinder 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="18">
<h2>Dit is een vlinder 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="19">
<h2>Dit is een vlinder 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="20">
<h2>Dit is een vlinder 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
</div>
</section>
<section>
<div class="left" id="btn-l">links</div>
<div class="right" id="btn-r">rechts</div>
<div id="head1">
<h2>Series</h2>
</div>
<div class="container">
<div class="item first" data-childId="21">
<div class="caption">
<div class="title">
<p>Dit is een poes 1.</p>
</div>
</div>
</div>
<div class="item first" data-childId="22">
<div class="caption">
<div class="title">
<p>Dit is een poes 2.</p>
</div>
</div>
</div>
<div class="item first" data-childId="23">
<div class="caption">
<div class="title">
<p>Dit is een poes 3.</p>
</div>
</div>
</div>
<div class="item first" data-childId="24">
<div class="caption">
<div class="title">
<p>Dit is een poes 4.</p>
</div>
</div>
</div>
<div class="item first" data-childId="25">
<div class="caption">
<div class="title">
<p>Dit is een poes 5.</p>
</div>
</div>
</div>
<div class="item second" data-childId="26">
<div class="caption">
<div class="title">
<p>Dit is een tijger 1.</p>
</div>
</div>
</div>
<div class="item second" data-childId="27">
<div class="caption">
<div class="title">
<p>Dit is een tijger 2.</p>
</div>
</div>
</div>
<div class="item second" data-childId="28">
<div class="caption">
<div class="title">
<p>Dit is een tijger 3.</p>
</div>
</div>
</div>
<div class="item second" data-childId="29">
<div class="caption">
<div class="title">
<p>Dit is een tijger 4.</p>
</div>
</div>
</div>
<div class="item second" data-childId="30">
<div class="caption">
<div class="title">
<p>Dit is een tijger 5.</p>
</div>
</div>
</div>
<div class="item third" data-childId="31">
<div class="caption">
<div class="title">
<p>Dit is een aap 1.</p>
</div>
</div>
</div>
<div class="item third" data-childId="32">
<div class="caption">
<div class="title">
<p>Dit is een aap 2.</p>
</div>
</div>
</div>
<div class="item third" data-childId="33">
<div class="caption">
<div class="title">
<p>Dit is een aap 3.</p>
</div>
</div>
</div>
<div class="item third" data-childId="34">
<div class="caption">
<div class="title">
<p>Dit is een aap 4.</p>
</div>
</div>
</div>
<div class="item third" data-childId="35">
<div class="caption">
<div class="title">
<p>Dit is een aap 5.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="36">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 1.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="37">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 2.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="38">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 3.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="39">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 4.</p>
</div>
</div>
</div>
<div class="item fourth" data-childId="40">
<div class="caption">
<div class="title">
<p>Dit is een vlinder 5.</p>
</div>
</div>
</div>
</div>
<div class="wall-container">
<span class="close"><i class="fa fa-times"></i></span>
<div class="wall" data-itamId="21">
<h2>Dit is een poes 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="22">
<h2>Dit is een poes 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="23">
<h2>Dit is een poes 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="24">
<h2>Dit is een poes 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="25">
<h2>Dit is een poes 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="26">
<h2>Dit is een tijger 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="27">
<h2>Dit is een tijger 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="28">
<h2>Dit is een tijger 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="9">
<h2>Dit is een tijger 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="30">
<h2>Dit is een tijger 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="31">
<h2>Dit is een aap 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="32">
<h2>Dit is een aap 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="33">
<h2>Dit is een aap 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="34">
<h2>Dit is een aap 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="35">
<h2>Dit is een aap 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="36">
<h2>Dit is een vlinder 1.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="37">
<h2>Dit is een vlinder 2.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak </p>
</div>
<div class="wall" data-itamId="38">
<h2>Dit is een vlinder 3.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="39">
<h2>Dit is een vlinder 4.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
<div class="wall" data-itamId="40">
<h2>Dit is een vlinder 5.</h2>
<p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak</p>
</div>
</div>
</section>
</body>
</html>
Jquery查询
$('.close').hide();
$(".item[data-childId]").on("click", function(e) {
$(".wall").hide();
var childId = $(e.currentTarget).data("childid");
var parent = $("div[data-itamId='" + childId + "']").parent(".wall-container");
$(parent).css({position: "static"});
$("div[data-itamId='" + childId + "']").show();
$('.close', parent).show();
});
$('.close').click(function(){
$(".wall").hide();
$('.close').hide();
$('.wall-container').css({position: "absolute"});
});
var count = 0;
$('.links').hide();
$('.rechts').click(function(){
$('.links').show();
count+= 1;
if(count >= 3){
$('.rechts').hide();
}
});
$('.links').click(function(){
count-=1;
if(count<3){
$('.rechts').show();
}
if(count == 0){
$('.links').hide();
}
});
var page = 0;
$('.left').hide();
$('.right').click(function(){
$('.left').show();
page+= 1;
if(page >= 3){
$('.right').hide();
}
});
$('.left').click(function(){
page-=1;
if(page<3){
$('.right').show();
}
if(page == 0){
$('.left').hide();
}
});
CODE THAT DOESN'T WORK ANYMORE不再工作的代码
(function($) {
$('section').each(function(){
var slider = $(this).find('.container'),
parent = $(this),
step = 1400,
left = parseInt(slider.css('left'), 10),
max = parent.width() - slider.width(),
min = 0;
console.log(parent);
parent.find(".right").click(function() {
if (left > max) {
var newLeft = left - step;
left = (newLeft>max) ? newLeft : max;
slider.animate({
"left": left + 'px'
}, "slow");
}
});
parent.find(".left").click(function() {
if (left < 0) {
var newLeft = left + step;
left = (newLeft<min) ? newLeft : min;
slider.animate({
"left": left + 'px'
}, "slow");
}
});
});
});
CSS CSS
@charset "utf-8";
/* CSS Document */
body{
background-color: black;
color:white;
}
section{
max-width: 1400px;
overflow: hidden;
margin: auto;
}
.container{
width: 400%;
margin: auto;
display: flex;
align-items: center;
position: relative;
overflow: hidden;
left: 0px;
z-index: 10;
/*transform: translate(-75%);
Dit zijn je speelvelden (0% = pagina 1; 25% = pagina 2; etc. */
}
.item{
flex-grow: 1;
height: 100px;
width: 200px;
transition: all 300ms ease-in-out;
position: relative;
}
.first{
background: url('https://cdn.pixabay.com/photo/2019/12/15/18/24/winter-4697776_1280.jpg') no-repeat center center transparent;
background-size: cover;
}
.second{
background: url('https://cdn.pixabay.com/photo/2019/02/22/12/30/forest-4013452_1280.jpg') no-repeat center center transparent;
background-size: cover;
}
.third{
background: url('https://cdn.pixabay.com/photo/2019/11/22/06/40/wolchulsan-4644223_1280.jpg') no-repeat center center transparent;
background-size: cover;
}
.fourth{
background: url('https://cdn.pixabay.com/photo/2019/08/02/14/20/eagle-4379798_1280.jpg') no-repeat center center transparent;
background-size: cover;
}
.item:hover{
flex-grow: 2;
height: 150px;
}
.caption{
opacity: 0;
position: absolute;
top: 65%;
left: 15px;
right: 0;
bottom: 0;
transition: all 300ms ease-in-out;
}
.item:hover .caption{
opacity: 1;
color: aliceblue;
font-size: 150%;
}
#links{
text-align: center;
width:50px;
height: 100px;
border: 1px solid red;
position: absolute;
left: 10px;
top: 145px;
z-index: 100;
}
#rechts{
text-align: center;
width:50px;
height: 100px;
border: 1px solid red;
position: absolute;
right: 10px;
top: 145px;
z-index: 100;
}
.wall{
display: none;
background: rgba(205,157,158,0.50);
}
.wall-container{
width: 90%;
height: 200px;
margin: auto;
padding: 15px;
color: white;
top: 300px;
left: 150px;
position: absolute;
overflow: hidden;
}
.wall p{
width:30%;
position: relative;
}
.close{
position: relative;
float: right;
}
#btn-l{
text-align: center;
width:50px;
height: 100px;
border: 1px solid red;
position: absolute;
left: 10px;
top: 310px;
z-index: 100;
}
#btn-r{
text-align: center;
width:50px;
height: 100px;
border: 1px solid red;
position: absolute;
right: 10px;
top: 315px;
z-index: 100;
}
1 个解决方案
解决方案1
0 已采纳 2019-12-29 14:08:36
在不起作用的代码部分将(function($){ to $(function() {更改(function($){ to $(function() { ！
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
如何通过Jquery滑动Slider的元素 - How to slide an element of a Slider by Jquery
为什么我的JavaScript轮播的幻灯片无法重置？ - Why does the slide of my javascript carousel not reset?
如何在轮播滑块中选择此类的单个值并将其输出到活动幻灯片中？ - How to select the single value of this class in a carousel slider and output it in the active slide?
jQuery：创建幻灯片轮播 - jquery: Creating a slide carousel
jQuery 轮播幻灯片动画 - jQuery carousel slide animation
javascript轮播不滑动 - javascript Carousel does not slide
jQuery：如何实现滑块（轮播）控制器？ - jQuery: how to implement controller for slider (carousel)?
如何为滑块中的每张幻灯片迭代 jQuery 函数？ - How iterate a jQuery function for each slide in a slider?
如何重新加载光滑（滑块/轮播）jQuery插件？ - How to Reload slick (slider/carousel) jQuery plugin?
jQuery轮播滑块自动播放 - jQuery carousel slider autoplay
相关标签