我有一个带有多个聊天 DIV 的窗口,用户可以在其中与不同的人聊天。
目前,聊天 DIV 可以打开并移动,但我看不到将当前选择的 DIV 设置在前面。例如:当您将鼠标放在 DIV 上时,它会进入前台。
HTML:
<div id="1000000001" class="chatMessenger">
<div class="chatMessengerContainer">
</div>
</div>
CSS:
div.chatMessenger {
position: absolute;
top: 50px;
left: 50px;
width: 250px;
height: 300px;
background-color: white;
z-index: 100;
border: 1px solid black;
}
JQUERY:
// JQUERY UI Draggable - Initialize
$('div#'+memberID).draggable({
containment: $('div#chatWrapper')
});
// JQUERY UI Draggable - Setting the Stack
$(document).on('mousedown','div.chatMessenger', function() {
alert('chat mouse down...');
//var stack = $( ".selector" ).draggable( "option", "stack" );
$(this).draggable( "option", "stack", ".products" );
});
警报在鼠标按下时触发,因此这是找到正确的元素。
我查看了 Draggable z-index 和 stack,但都无法正常工作。
会有很多聊天DIV同时打开,选择一个需要坐在前面。
谢谢。
这应该有帮助
$('div.chatMessenger').not(this).css('z-index', '100');
$(this).css('z-index', '1000');
inside on('mousedown')
功能。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)