这里引入相关的4条博客,与我们讲的实例有关
https://www.haorooms.com/post/jquery_offset_xy
https://www.cnblogs.com/goloving/p/7113567.html
http://www.cnblogs.com/anniey/p/6591079.html
https://blog.youkuaiyun.com/linbooooo1987/article/details/17464725
<script type="text/javascript">
$(".check-item").click(function(){
// 给span元素添加同胞节点
$(this).after("<div class='aa'>Hello</div>");
// span的堂兄弟元素不添加插入的节点
$(this).parent().siblings().children("span").siblings().remove();
// 获取插入元素的高度
var h = $(".aa").height();
// 由于元素高度太小时不美观,额外加高
var he = h + 30;
// 设置被点击元素样式
$(this).css({"background-color":"#b72e29","color":"#fff"});
$(this).css("margin-bottom",he +"px");
// 设置被点击元素的堂兄弟样式
$(this).parent().siblings().children().css({"margin-bottom":"0px"});
$(this).parent().siblings().children().css({"background-color":"#fff","color":"#666"});
// 动态计算left的值
var a = $(this).offset().left;
var b = $("#check").offset().left;
var l = $("#check").offset().left - $(this).offset().left;
$(".aa").css("left",l + "px");
});
</script>

149

被折叠的 条评论
为什么被折叠?



