Question

当我尝试使用jQuery UI定位元素时出现错误。错误是＆＃34; Uncaught TypeError：无法读取属性＆＃39; nodeType＆＃39;未定义＆＃34; 我试图一次制作2个div的幻灯片。带有＃34; child＆＃34;类的第二个div应该翻转，这样它就不会超出330px宽的div包装容器。

<div class="wrapper">       
  <div class="parent">
    <div class="sibling">Sibling Text</div>
    <div class="child">
        <h2>title 1</h2>
        <p>here is some text a</p>
    </div>
  </div>
    <div class="parent">
    <div class="sibling">Sibling Text</div>
    <div class="child">
        <h2>title 2</h2>
        <p>here is some text b</p>
    </div>
</div>
</div>

$('.child').position({
    my:"left top",
    at:"left top",
    of: $(this).closest('.sibling),
    collision:"flip",
    within: $('.wrapper')   
});

$('.sibling').on("click",function(){
$('.child').hide();
$(this).parent().find('.child').slideDown();
});

.wrapper{width:330px}
.parent{
float:left;
width:160px;
height:300px;
border:1px solid #000;
position: relative;
}
.child{
width:250px;
position: absolute;
border:1px solid #000;
background-color:rgba(125,125,125,.8);
color:#fff;
text-align:center;
display:none;
}

请参阅JSFiddle

Answer 1

试试这个：

$('.child').position({
    my: "left top",
    at: "left top",
    of: $(this).closest('.sibling')[0], //pass element instead of array.
    collision: "flip",
    within: $('.wrapper ')
});
$('.sibling ').on("click", function () {
    $('.child ').hide();
    $(this).parent().find('.child ').slideDown();
});

演示：http://jsfiddle.net/x2enz2bs/16/

使用jquery UI位置时出错

1 个答案: