0
我最近一直在尝试使用jquery来创建和html动画，并且我正在尝试使条形图向右浮动，因为它当前浮动到左侧。虽然当我尝试这样做，它不会工作，请帮助如何做jquery动画正确浮动
HTML：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title</title>
<link rel="stylesheet" href="assests/css/main.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".bar").animate({float: 'right'});
});
</script>
</head>
<body>
<div id="wrapper" align="center" >
<div class="obj">
<div class="bar"></div>
<div class="body">
<h1> Welcome </h1>
</div>
</div>
</div>
</body>
</html>
的CSS：
@import url(https://fonts.googleapis.com/css?family=Raleway);
* {
margin:0px;
padding:0px;
font-family:Raleway;
}
#wrapper {
width:100%;
height:100vh;
}
.obj {
width:500px;
height:200px;
margin-top:14%;
}
.bar {
float:left;
height:200px;
width:5px;
background-color:#95a5a6;
transition: all .5s ease-in-out;
}
.body {
width:495px;
height:200px;
float:right;
}
.body > h1 {
font-size:70px;
color:#333;
padding-top:50px;
}
您无法为'float'属性设置动画。你最好的选择是让元素“position：absolute”，然后动画它的“左”和/或“右”位置。我想这会花费相当数量的HTML重新工作。 –
@RoryMcCrossan好的，谢谢你的帮助，我会确保你看看！ –