-1

画像スライダーを作りました。画像をクリックすると、テキストを含む を動的に作成しdivています。画像の onClick イベントで、画像に を追加するdivと、画像が反転してdiv表示されるはずです。しかし、画像はページの右側に表示されています。画像の位置と同じ位置にするにはどうすればよいですか?

このコードを使用してdiv、画像を作成してから追加します。

function flipIt(obj){
    //$(obj).wrap("<div class='centerImage'></div>")

    console.log("value before Function status   "+status);

    $(obj).wrap($('<div class="foobar"/>').css({
        "position" : "absolute",
        "left"     : $(obj).position().left,
        "top"      : $(obj).position().top,
        "height"   :$(obj).height(),
        "width"    :$(obj).width(),
    }));
    $
    alert('classes ..'+$(obj).hasClass("foobar").toString());
    $(obj).animate({"left": "-=40px","opacity": "0.65"},"slow");
    $(obj).animate({"height":"600px","width":"320px"},30);

    $(obj).css("-webkit-backface-visibility","hidden");
    $(obj).css("-webkit-transform-style","preserve-3d");
    $(obj).css("-webkit-transition","all 1.0s linear");
    $(obj).css("transform-style","preserve-3d");
    $(obj).css("transition","all 1.0s linear");

    $(obj).css("-webkit-transform","rotateY(180deg)");
    $(obj).css("transform","rotateY(180deg)");
    //$(obj).css("box-shadow","-5px 5px 5px #aaa");

    status=0;
    console.log("after if value set status   "+status);
}

.foobar div の CSS プロパティ:

.foobar
{
    -webkit-backface-visibility:visible;
    position:absolute;
    color:red;
    background-color: red;
    background:red;
    content: div is here;
    height:450px;
    width:250px;
}

div選択した位置に移動するにはどうすればよいimgですか?

4

2 に答える 2

0

このコードを試してください：

 $("#id").wrap('<div class="foobar"/>');

デモを見る

于 2013-05-07T10:30:07.507 に答える
0

$("#id").html("<div class='foobar'>This is div</div>")
画像が存在する div の ID 名を指定します

于 2013-05-07T10:14:39.970 に答える