こんにちは私はjqueryに不慣れです私はあなたのより経験豊富な人の一人が私を助けてくれることを望んでいました。コンテナをオーバーフローに設定しています。非表示で、内部に3つのdivがあり、そのうちの2つはオーバーフローしているため非表示になっています。コンテナをクリックするたびに、すべてのdivが右からスライドする順序で表示されるようにしたいと思います。クリックすると2番目のdivが表示されますが、3番目のdivを移動できません。コンテナがクリックされるたびに、内部のdivは100px移動するはずですが、移動しません。なぜそうならないのか説明してください。これがJSフィドルリンクです-> http://jsfiddle.net/FSMMA/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
.container{
width:100px;
height:100px;
overflow:hidden;
position:relative;
}
.one,.two,.three{
display:inline-block;
position:relative;
}
.one{
width:100px;
height:100px;
background-color:green;
}
.two{
width:100px;
height:100px;
background-color:red;
}
.three{
width:100px;
height:100px;
background-color:blue;
}
.boxes{
width:400px;
}
</style>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('.container').click(function(){
$('.boxes').offset({left :-100})
});
});
</script>
<div class="container">
<div class="boxes">
<div class="one">
</div>
<div class="two">
</div>
<div class="three">
</div>
</div>
</div>
</body>
</html>