Jquery 在容器DIV元素中滚动聊天窗口

在我的代码中，我有一个容器

，其中将动态添加

元素（聊天窗口）。它检查

（聊天窗口）元素宽度的总数是否超过容器

，如果超过，则会出现“上一步”和“下一步”按钮，并在容器中滚动

。但我不明白这个问题。任何帮助都将不胜感激

这是我的代码：

现在更新了此代码。现在的问题是如何根据条件隐藏“下一步”和“上一步”按钮。

var chatboxs=new Array（）；
var chatboxtitle=1；
$（文档）.ready（函数（）{
$（“#添加”）。单击（函数（）{
$（'#容器'）。附加（$（''）
.attr（“id”、“聊天盒”+聊天盒标题）
.addClass（“chatWin”）
.html（“聊天盒”+聊天盒标题）
);
chatboxs.push（“chatbox\uux”+chatboxtitle）；
chatboxtitle++；
chk（）；
});
})
函数chk（）
{
var i=0；
用于（聊天框中的x）{
i++；
}
如果（（i*200）>600）{
$（“#prev”）.show（）；
$（“#nxt”）.show（）；
}
}
$（文档）.ready（函数（）
{
$（'#prev'）。单击（函数（）
{
var newMargin=parseInt（$（“#容器”）.css（“左”）+212；
$（“#容器”）.animate（{left:newMargin}，50）；
});
$（'#nxt'）。单击（函数（）
{
var newMargin=parseInt（$（“#容器”）.css（“左”）-212；
$（“#容器”）.animate（{left:newMargin}，50）；
});
});

#聊天{
右边框：1px实心#bac0cd；
底部：0px；
左：15px；
字体系列：“Lucida Grande”，Verdana，Arial，“Bitstream Vera Sans”，无衬线；
字体大小：11px；
高度：29px；
位置：固定；
文本对齐：左对齐；
z指数：1028；
边缘顶部：8px；
-webkit边框左上半径：3px；
-webkit边框右上角半径：3px；
-左上角moz边界半径：3px；
-moz边框半径右上角：3px；
边框左上半径：3px；
边框右上角半径：3px；
宽度：98%；
}
#主要{
浮动：对；
高度：29px；
宽度：636px；
溢出：隐藏；
空白：nowrap；
显示：块；
方向：rtl；
左：0px；
位置：相对位置；
}
#容器{
浮动：对；
位置：相对位置；
左：0px；
}
.查特温，伙计{
背景：颜色：#f2f4；
右边框：1px实心透明；
左边框：1px实心#bac0cd；
颜色：#333；
光标：指针；
高度：29px；
左侧填充：10px；
垫面：5px；
z指数：1026；
边框顶部：1px实心rgba（29,49,91,3）；
-webkit盒阴影：插入0 1px rgba（255、255、255、.5）；
宽度：200px；
字体大小：粗体；
显示：内联块；
}
#nxt{
浮动：对；
背景色：#f2f4；
右边框：1px实心透明；
左边框：1px实心#bac0cd；
颜色：#333；
光标：指针；
高度：29px；
位置：相对位置；
垫面：5px；
左侧填充：2px；
右侧填充：2px；
z指数：1026；
边框顶部：1px实心rgba（29,49,91,3）；
-webkit盒阴影：插入0 1px rgba（255、255、255、.5）；
字体大小：粗体；
显示：无；
边框右上角半径：5px；
}
#上{
浮动：对；
背景色：#f2f4；
右边框：1px实心透明；
左边框：1px实心#bac0cd；
颜色：#333；
光标：指针；
高度：29px；
位置：相对位置；
垫面：5px；
左侧填充：2px；
右侧填充：2px；
z指数：1026；
边框顶部：1px实心rgba（29,49,91,3）；
-webkit盒阴影：插入0 1px rgba（255、255、255、.5）；
字体大小：粗体；
显示：无；
边框左上半径：5px；
}

新增
在线用户（0）
►
◄

但我无法解决这个问题。你能简单解释一下吗？我想做一个类似fb的聊天吧。在“我的代码”中单击“添加新”时，自动添加div。下一个上一个按钮(◄/►) 当出现3个以上的聊天窗口时将显示，其他窗口将隐藏，并且仅当单击下一个上一个按钮时显示。您应该首先将事件

onclick

绑定到两个箭头上。如果我是您，我会在

中添加一个

位置：绝对值
，以便在下一步中使用
z-index
我希望你能理解我的问题。你能解释一下吗？这个想法是创建一个包含你的聊天框的盒子（您使用的是
。然后，当propretie
位置：绝对
处于活动状态时，propretie
位置：relative
将允许您在其内部构建所有
。此外，在此范围内，您将向您的id添加一些其他
，因此您应该放置一个
class=“buddy”
相反，因为当您附加到容器中时，您看不到它们。您应该附加到“聊天”中，并使用
z-index
显示一个或多个，隐藏其他内容。