こんにちは、かなり変更が必要な場所で入手したチャット スクリプトを作成しています。私が達成する必要がある機能は、ビューとチャットするユーザーの読み込みが成功した後、直接下に行く必要があります。私は何度か失敗したことをしましたが、自動で下に移動しますが、コンテンツをスクロールしようとすると、まだ下に戻りますが、これは起こるべきではありません。
これは私がこれまでに持っているものです。
<?php
$ctr = 0;
if (is_array($buddies)) {
foreach ($buddies as $buddy) {
?>
<span style="float: right;"><?php echo $buddy->unreadMsgCtr; ?></span>
<b><a href="#" class="username" id="friend<?php echo $ctr; ?>" chattingID="<?php echo $buddy->uidDetailsID?>"><?php echo humanize($buddy->fullName) ?></a></b> <br />
<?php
++$ctr;
}
}
?>
<script type="text/javascript">
$(document).ready(function() {
<?php for ($ctrjs = 0; $ctrjs < $ctr; $ctrjs++) {?>
$('#friend' + <?php echo $ctrjs; ?>).live('click', function() {
$('#buddies').hide();
var chattingWith = $(this).attr('chattingID');
startrefresh();
$('#chatroom').show();
$('#chatmessage').html('<img src="<?php echo site_url('/images/ajax-loader.gif');?>" width="16" height="16" />');
$.post("<?php echo site_url('chats/chatbuddy');?>",{
username: $("#friend"+<?php echo $ctrjs; ?>).html(),
recipientID: chattingWith
});
});
<?php } ?>
});
</script>
//chats.php 特定の仲間がクリックされたとき。
<script type="text/javascript">
var autoScrollEnabled = true;
$(document).ready(function() {
toggleAutoScroll();
if(autoScrollEnabled == true) {
$(".messages").animate({ scrollTop: $('.messages')[0].scrollHeight}, 1000);
//return false;
toggleAutoScroll();
}
function toggleAutoScroll() {
autoScrollEnabled = !autoScrollEnabled; //! reverses the value, true becomes false, false becomes true
if (autoScrollEnabled == true) { //scroll down immediately if a.s. is reenabled
$(".messages").animate({ scrollTop: $('.messages')[0].scrollHeight}, 9999999999);
}
}
$('#closechat').live('click', function() {
$('#chatroom').hide();
//scrolled = 0;
stoprefresh();
});
});
</script>
<div class="headerchat" style="width: 217px;"><div class="buddycontainer"> Chatting</div>
<div class="closecontainer"><a href="#" id="closechat" class="close">✖</a> </div>
<br class="breaker" />
</div>
<?php
if (is_array($chat)) {
foreach ($chat as $item){ ?>
<div class="conversation" style="width: 215px;">
<b><span class="username"><?php echo $item['username']; ?></span></b>
<span class="gray" style="float: right;" title="<?php echo date('M d, Y g:i A', $item['time']);?>"> <?php echo date('g:i A', $item['time']);?></span>
<br /><?php echo $item['message']; ?>
</div>
<?php } ?>
<?php }?>
ところで、これはjsfiddleで正しく動作していることを理解していないjsfiddleです。http://jsfiddle.net/STQnH/3/
正しい道を進んでいるかどうかはわかりません。私はそれを達成したいだけです。君たちありがとう。