Javascript 类堆栈溢出错误显示

看到这个了吗

我拥有的是同一类的

按钮

和

div

。 当我单击一个类的

按钮
时，同一类的
div
会获得
滚动视图
，并且
日志会出现在div右侧的旁边

问题

单击按钮后，不会出现滚动
.log
不会出现在
div
小三角形指针不会出现在
.log
添加内容（我想要但不知道怎么做的东西！）

每当出现
.log
时，我希望它向上和向下晃动一点

这将一直持续到鼠标悬停

在
mouseout
之后，我希望
.log
到
fadeOut（2000）

针对下层选民

<button class="a1">Div1</button>
<button class="a2">Div2</button>
<button class="a3">Div3</button>
<button class="a4">Div4</button>
<button class="a5">Div5</button>
<button class="a6">Div6</button>
<div id="container">
    <div class="a1">This is div1</div>
    <div class="a2">This is div2</div>
    <div class="a3">This is div3</div>
    <div class="a4">This is div4</div>
    <div class="a5">This is div5</div>
</div>
<div class="log">Your have a fatal error.</div>


#container div {
    height:250px;
    width:250px;
    border:2px solid #000;
    margin:15px;
}
#container {
    margin:20px;
}
.log {
    z-index: 1;
    display: none;
    color: #fff;
    background-color: #c04848;
    text-align: left;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    max-width:270px;
    font-size:15px;
    padding:10px;
    position: absolute;

}
.log:after {
    top: 0;
    left: -9px;
    border-top: 9px solid #c04848;
    border-left: 9px solid transparent;
}


    $('button').click(function(){
             var c =  $(this).attr('class');
             var div = $('#container div.'+c);     
        $(document).scrollTo(div, 1000);
        log.css({
            top : div.position().top + div.height()/2,
            left : div.position().left + 20
        }).show();
    });

Div1
第二组
第三组
第四组
第五组
第六组
这是第一组
这是第二组
这是第三组
这是第四组
这是第五组
你有一个致命的错误。
#货柜组{
高度：250px；
宽度：250px；
边框：2倍实心#000；
利润率：15px；
}
#容器{
利润率：20px；
}
.日志{
z指数：1；
显示：无；
颜色：#fff；
背景色：#c04848；
文本对齐：左对齐；
盒影：0 2px 5px rgba（0,0,0,0.3）；
最大宽度：270px；
字体大小：15px；
填充：10px；
位置：绝对位置；
}
.log:之后{
排名：0；
左：-9px；
边框顶部：9px实心#c04848；
左边框：9px实心透明；
}
$（“按钮”）。单击（函数（）{
var c=$（this.attr（'class'）；
var div=$（“#容器div.”+c）；
美元（文件）.scrollTo（部门，1000）；
log.css({
顶部：分区位置（）.顶部+分区高度（）/2，
左：分区位置（）.左+20
}).show（）；
});
修复了它

$('button').click(function(){
         var c =  $(this).attr('class');
         var div = $('#container div.'+c);     
    $(document).scrollTop(div.offset().top);
    $('.log').css({
        top : div.position().top + div.height()/2,
        left : div.position().left + 20
    }).show();
});

我所做的是将
滚动条改为
滚动条
。我在log类中添加了一个选择器，因为您很可能忘记了它

动摇效应
试着做点什么也许吧

我的答案的所有部分都显示在下面

在scrollTo方面，您可能正在寻找scrollTop。试着这样做：

scrollTop: div.offset().top

$('.log').css({...

而不是：

$(document).scrollTo(div, 1000);

不过，根据你在那里写的内容，我假设你想要平稳过渡到div，对吗？请尝试以下方法：

$('html, body').animate({
    scrollTop: div.offset().top
}, 1000);

这将创建到div的平滑滚动，而不仅仅是移动到div

对于日志部分，您忘记引用日志类。相反，您试图像引用变量一样引用它，因此解释器感到困惑。尝试将日志css调用放入引用中，如下所示：

scrollTop: div.offset().top

$('.log').css({...

希望这些帮助

编辑：你是不是打算为这次反弹做点什么？（上下？）。不管是哪种情况，@Dharman对代码的理解都是正确的。您可能只想添加另一个动画（类似于滚动），但在结尾处放置一个超时（因此该方法将不断重复）
因为我不能接受任何人的答案，因为我不喜欢他们，但感谢
反弹
动画的想法，它确实起了作用。。。
现在我已经创建了我自己的，它工作得很好

$('button').click(function () {
    var c = $(this).attr('class');
    var div = $('div.' + c);
    $('html, body').animate({
        scrollTop: div.offset().top
    }, 1000); //thanks to Dylan Corriveau
    console.log(div.position().left);
    $('.log').css({
        top: div.position().top + div.height() / 2,
        left: div.position().left + div.width() + 50
    }).show();
    clearTimeout(inter);
    setTimeout(bounceOn, 500);

});

$('.log').mouseover(function () {
    clearTimeout(inter);
}).mouseout(function () {
    $(this).fadeOut(3500);
});

var inter;
//here is the magic!
function bounceOn() {
    var pos = $('.log').position().left;
    $('.log').animate({
        left: pos + 15
    }, 50, function () {
        $('.log').animate({
            left: pos
        }, 50)
    })
    inter = setTimeout(bounceOn, 215);
}

请将代码粘贴到问题本身。JSFIDLE很好，但单靠它本身还不够。done@Juhana………
scrollTo
是一个jQuery插件-但是关于shaky
.log
呢？看看我的编辑，让我知道这是否是你想要的，但是关于shaky
的呢
应连续左右或前后设置动画，直到其
鼠标悬停
就像在stackoverflow中提问时所做的那样@dharman@HackerManiac你说“是的，当然，完成了”是什么意思？1.5年后你对这个答案不满意吗？不，我妈妈出现的时候我正在看色情片，所以我打开了这个，评论说它很快，但是没有逻辑，所以没关系