Javascript Jquery+；css转换仅在console.log（…css（"；left"；）时才能正常工作；被称为

我正在使用Jquery、Javascript和CSS制作一个旋转木马来处理每个项目的转换，但是滑动方向只有在

console.log（$tipToAnimate.CSS（“左：））时才能正确工作；

是在条件语句之后添加的，用于指定方向。起初我认为这可能是因为触发太快的问题，所以我在添加

.current

类（控制幻灯片何时出现）之前添加了一个超时但这并没有改变行为。我使用类来处理所有这些，并使用Jquery来设置CSS，但这也产生了相同的行为

以下是我所拥有的：

var TIPS=TIPS | |{}；
TIPS.animateTips=函数（箭头）{
变量$arrow=$（arrow.target），
方向=$arrow.data（“方向”），
$tip=$arrow.parent（）；
animateTip（$tip，direction）；
};
函数animateIn（自我、方向）{
如果（方向=“左”）{
var$tipToAnimate=self.prev（）；//如果向左走，请查找上一个提示
}否则如果（方向=“右”）{
var$tipToAnimate=self.next（）；//如果正确，请查找下一个提示
}
如果（$tipToAnimate.length==0）{//如果没有上一个或下一个提示
如果（方向=“左”）{
$tipToAnimate=$（self.nextAll（.tip”）.last（）；//如果在第一个提示上，则查找最后一个提示
}否则如果（方向=“右”）{
$tipToAnimate=$（self.prevAll（.tip”）.last（）；//如果在最后一个，则查找第一个提示
}
}
positionTip（$tipToAnimate，direction）；//这是定义left的函数
revealTip（$tipToAnimate，方向）；
$tipToAnimate.addClass（“当前”）；
}
函数动画输出（自身、方向）{
self.addClass（“退出”）；
如果（方向=“左”）{
css（“左”，“-1400px”）；
}否则如果（方向=“右”）{
css（“左”，“1300px”）；
}
自移除类（“当前”）；
$（“.exiting”）.one（“transitionend WebKittTransitionEnd”或transitionend MSTransitionEnd”，函数（）{
$（this.css（“左”，“右”）；
$（this.addClass（“隐藏”）.removeClass（“退出”）；
$（this）.off（“transitionend WebKittTransitionEnd或transitionend MSTransitionEnd”）；
});
}
函数animateTip（自我、方向）{
动画输出（自我、方向）；
animateIn（自我、方向）；
}
函数loadCarousel（）{
$（“.tip:not（.current）”）.addClass（“hidden”）；
}
功能位置提示（自我、方向）{
如果（方向=“左”）{
$（self.css（“左”，“1400px”）；
}否则如果（方向=“右”）{
$（self.css（“左”，“-1400px”）；
}
console.log（$（self.css（“left”）；//如果删除此项，则旋转木马将使用css类“hidden”作为左值，即使在这里定义了它
}
功能revealTip（自我、方向）{
$（self.removeClass（“隐藏”）；
$（self.css（“左”，“右”）；
}
$（文档）.ready（函数（）{
$（“.arrow”）.bind（“单击”，TIPS.animateTips）；
装载转盘（）；
})；

ul{
列表样式类型：无；
}
.pages-resource_prototype.tip{
背景：#ffffff；
底部：0；
最大宽度：550px；
填料：2米；
位置：绝对位置；
排名：0；
宽度：100%；
}
.pages-resource_prototype.tip.current{
-webkit过渡：所有0.4s易用性；
-moz过渡：所有0.4s易用性；
过渡：所有0.4s缓解；
}
@媒体屏幕和屏幕（最小宽度：48.75em）{
.pages-resource_prototype.tip.current{
左：2.5em；
}
}
.pages-resource_prototype.tip.hidden{
左：-1400px；
}
.pages-resource_prototype.tip.exiting{
-webkit过渡：所有0.4s易用性；
-moz过渡：所有0.4s易用性；
过渡：所有0.4s缓解；
}
.pages-resource_原型。提示内容。字幕{
颜色：#5d57a2；
}
.pages-resource_原型。提示编号{
颜色：#999；
字号：0.9em；
边缘底部：1.5em；
}
.pages-resource_prototype.tips{
背景#48C1C9；
}
.pages-resource_原型。提示列表{
最小高度：35em；
溢出：隐藏；
位置：相对位置；
宽度：90%；
}
@媒体屏幕和屏幕（最小宽度：48.75em）{
.pages-resource_原型。提示列表{
宽度：自动；
}
}

1.
属于
4.
<
>
提示名称

尖端类型


Lorem ipsum dolor sit amet，一位杰出的领导者，一位伟大的领袖
暂时性的劳动和财产损失是最小的
在工厂外的实验室实习
在沃鲁帕特的reprehenderit中，两人或两人的共同利益
除圣奥凯卡岛外，无任何法定权利
丘比特不轻率，必须为自己的行为负责
胎膜早破



2.
属于
4.
<
>
提示名称

尖端类型


Lorem ipsum dolor sit amet，一位杰出的领导者，一位伟大的领袖
暂时性的劳动和财产损失是最小的
在工厂外的实验室实习
在沃鲁帕特的reprehenderit中，两人或两人的共同利益
除圣奥凯卡岛外，无任何法定权利
.element-that-animates {
    transition: left 0.4s ease-in;
}

.element-that-animates.animate {
    left: 50px;
}