-6 
<div id="one">aaa</div>
<div id="two">bbbbbbbbbb</div>
<span id="click">click</span>

フィドル：http ：//jsfiddle.net/g6Myb/

span＃clickをクリックした後、どうすれば#twoを取得してjQueryで#oneに配置できますか？

<div id="one">aaa</div>
<div id="two">bbbbbbbbbb</div>
<span id="click">click</span>


#one {width: 200px; height: 200px; background-color: red}
#two {width: 200px; height: 200px; background-color: green; opacity: 0.3 }


$('.click').click(function(){})  // what to do here ?
4

3 に答える 3

0

新しいCSSクラスを作成する必要があります。

.hoverOpacity{
  position:absolute;
  top: 0; //or wherever you want to put it
  right: 0;  //or whereever you want to put it
  opacity: .5; //plus all the browser specific
}

次に、クリックして、このクラスをdivに追加します。

$('#click').click(function(){
   $('#two').addClass('hoverOpacity');
});
于 2013-01-22T15:32:02.310 に答える
0

IDではなくクラスをターゲットにしています

$('.click').click(function(){});
   ^----- USE #

この方法を使用できるよりも：

http://api.jquery.com/append/
http://api.jquery.com/appendto/

例:

$('#click').click(function(){
    $('#one').append( $('#two') );
});

$('#click').click(function(){
    $('#two').appendTo( $('#one') );
});

要素にテキストが含まれている場合、それらは必要なメソッドではない可能性があります...

だから、あなたが行くことができるよりもオーバーレイ #twoしたい場合：#oneoffset

jsBin demo

$('#click').click(function(){
    var TWOpos = $('#one').offset();
    var pos = {X: TWOpos.left, Y:TWOpos.top };
    $('#two').css({position:'absolute', left:pos.X, top:pos.Y });
});

http://api.jquery.com/offset/

DOCS: http://api.jquery.com/ (常に読んでください。これらはあなたのツールです!)

于 2013-01-22T15:25:59.617 に答える
0

それには約100万通りの方法がありますが、私が選んだ方法は、ラップ#oneし#twoて相対的に配置し、クリックすると0X0にdiv移動することです#two

あなたのフィドルを更新しました：

http://jsfiddle.net/g6Myb/1/

#one {width: 200px; height: 200px; background-color: red}
#two {width: 200px; height: 200px; background-color: green; opacity: 0.3 }
#wrapper{position: relative;}
#two.on{position: absolute; top:0; left:0;}


$('#click').click(function(){
    $("#two").addClass("on");
})
于 2013-01-22T15:29:32.823 に答える