-2

緑色のボックス ( #box3) が 90% だけ右に移動するようにします。ボックスは body 要素のすぐ内側にあります。

<div id='box1'>
    <div id='box2'>
    </div>
    <div id='box3'>
    </div>
</div>

$( "#box1" ).click(function() { $( "#box3" ).toggle("slide",

#box1 {
    background-color: white;
    height: 600px;
    width: 600px;
    margin: auto;
}
#box2 {
    background-color: red;
    height: 600px;
    width: 300px;
    float: left;
}
#box3 {
    background-color: green;
    height: 600px;
    width: 300px;
    float: left;
}
4

2 に答える 2

0

ボタンを使用してクリックすると、ボックスが右に 90% 移動します (ただし、位置は「絶対」である必要があります)。

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script> 
    $(document).ready(function(){
    $("button").click(function(){
    $("div").animate({left:"90%"}, "slow");
    });
    });
</script> 
</head>`

<body>

// click the button

<button> Box 3 </button>
<div style=background-color: "green"; height: "600px"; width: "300px"; float: "left"; position:"absolute";>
</div>

</body>
于 2013-08-10T10:25:35.870 に答える