05.05.2009, 19:40
|
|
Интересующийся
|
|
Регистрация: 27.04.2009
Сообщений: 16
|
|
млин, ну ведь все равно не работает 
сообщения продолжают добавляться, но автоматический скролл в самы низ дива не происходит.
Может быть стоит копать в сторону айдишника дива последнего сообщения?
хотя фокусом, также не скроллит 
вот итоговый код:
|
Код:
|
echo"<html><head>
<META HTTP-EQUIV='Content-Type' CONTENT='text/html; charset=windows-1251'>
<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='jquery.mousewheel.min.js'></script>
<script type='text/javascript' src='jScrollPane.js'></script>
<script type='text/javascript'>
$(function(){
$('.scroll-pane').jScrollPane({showArrows:true, scrollbarWidth:16, dragMaxHeight:20});
});
</script>
</head><body margin='0' border='0' onload='ChatGetMess();'>
<script type='text/javascript'>
var count = 0;
var chat_mode = 'all';
function ChatGetMess(){
jQuery.getJSON('chat_gm.php?chat_mode='+chat_mode+'', {}, function(json){
for(var k in json.messages){
count++;
jQuery('#mes').append('<div class=\"shoutbox-list\" id=\"list-'+count+'\">' + ShowMessage(json.messages[k]) + '</div>');
$('#list-'+count).fadeIn('slow');
$(function(){
$('.scroll-pane').jScrollPane({showArrows:true, scrollbarWidth:16, dragMaxHeight:20});
});
$('#mes').scrollTop($('#mes').get(0).scrollHeight||0);
}
});
timeoutID = setTimeout(ChatGetMess, 5000);
}
</script>
<div id='mes' class='scroll-pane' style='height:200px;'></div>
</body></html> |
Последний раз редактировалось SirNaFigator, 05.05.2009 в 21:21.
|
|
06.05.2009, 01:04
|
|
Интересующийся
|
|
Регистрация: 27.04.2009
Сообщений: 16
|
|
|
Господа гуру. сори если жутко туплю, но всетаки, подскажите лошаре в чем ошибка...не работает зараза =( уж очень нада!!!
|
|
06.05.2009, 03:02
|
 |
Профессор
|
|
Регистрация: 03.04.2009
Сообщений: 1,263
|
|
Скажите-ка, а какая у вас версия jquery, а то в примере не видно. В 1.2.3. метода scrollTop нет, в 1.2.6 -- есть. Вот это работает в ИЕ/ФФ/Опера:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.2.6.js"></script>
</head>
<body>
<div id='mes' style='height:200px;width:500px;border:1px solid yellow;overflow:scroll'></div><button onclick="$('#mes').append('<div style=\'border:1px solid green;height:30px\'></div>')">Append</button><button onclick="$('#mes').scrollTop($('#mes').get(0).scrollHeight||0)">Scroll</button>
</body>
</html>
Последний раз редактировалось e1f, 06.05.2009 в 03:53.
|
|
06.05.2009, 10:04
|
|
Интересующийся
|
|
Регистрация: 27.04.2009
Сообщений: 16
|
|
|
Действительно, пример работает. Огромное спасибо за помощь.
Ошибка видимо в том, что у меня плагин, который меняет вид скролла, на мой заданный. Видимо он сам по себе управляет скроллом и не дает им управлять мне =( Буду разбирацца....
А может стоит управлять скроллом с помощью функции скроллинга из этого плагина?
|
|
06.05.2009, 13:13
|
|
Профессор
|
|
Регистрация: 03.04.2009
Сообщений: 1,263
|
|
|
А, так вы эмулируете скролл плагином? Ну тогда смотрите методы плагина... Если не сможете разобраться -- кидайте плагин, посмотрим.
|
|
06.05.2009, 14:19
|
|
Профессор
|
|
Регистрация: 03.04.2009
Сообщений: 1,263
|
|
Скачал плагин... Похоже, он этого не поддежривает. Если поправить на коленке -- то можно так:
замените строку 59
var currentScrollPosition = settings.maintainPosition ? $this.position().top : 0;
на
var currentScrollPosition = (settings.hasOwnProperty('scrollPosition') && -settings.ScrollPosition) || (settings.maintainPosition ? $this.position().top : 0);
используйте при реините параметр scrollPosition:
$('.scroll-pane').jScrollPane({showArrows:true, scrollbarWidth:16, dragMaxHeight:20, scrollPosition:$('#mes').get(0).scrollHeight||0});
|
|
06.05.2009, 14:34
|
|
Профессор
|
|
Регистрация: 03.04.2009
Сообщений: 1,263
|
|
Демонстрационный файл после изменения плагина:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="jScrollPane.css" />
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript" src="jScrollPane-1.2.3.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){
$('.scroll-pane').jScrollPane({showArrows:true, scrollbarWidth:16, dragMaxHeight:20});
});
//-->
</script>
</head>
<body>
<div id='mes' class="scroll-pane" style='height:200px;width:500px;overflow:auto'></div>
<button onclick="$('#mes').append('<div style=\'border:1px solid green;height:30px\'>test div</div>')">Append</button>
<button onclick="$('.scroll-pane').jScrollPane({showArrows:true, scrollbarWidth:16, dragMaxHeight:20, scrollPosition:$('#mes').get(0).scrollHeight||0});">Scroll</button>
</body>
</html>
Скрипт и CSS взят с http://code.google.com/p/jscrollpane/downloads/list
|
|
06.05.2009, 15:23
|
|
Интересующийся
|
|
Регистрация: 27.04.2009
Сообщений: 16
|
|
Огромное спасибо!!!!
я тоже основательно порылся на этом ресурсе. В итоге обнаружил что всетаки плагин это поддерживает =) Но вот незадача.
Есть отдельный тестовый ХТМЛ документ, там все прекрасно работает...и именно так как мне нужно, но вот когда я код засовываю в свой скрипт то в отладчике вижу ошибку ScrollTop is not a function
причем я переносил все файлы включая последнюю версию jquery и самого плагина.
Код рабочей тестовой странички:
|
Код:
|
<HTML><HEAD><TITLE>jScrollPane</TITLE>
<META http-equiv=content-type content="text/html; charset=windows-1251">
<META content="MSHTML 6.00.2900.2180" name=GENERATOR>
<LINK media=all href="jScrollPane.css" type=text/css rel=stylesheet>
<SCRIPT src="jquery.min.js" type=text/javascript></SCRIPT>
<SCRIPT src="jquery.mousewheel.js" type=text/javascript></SCRIPT>
<SCRIPT src="jScrollPane.js" type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
count = 0;
$(function(){
$('#add-content').bind(
'click',
function(){
count++;
$pane = $('#mes');
var autoScroll = $pane.data('jScrollPanePosition') == $pane.data('jScrollPaneMaxScroll');
$pane.append('<div class="shoutbox-list" id="list-'+count+'">tyj</div>').jScrollPane({scrollbarWidth: 20, scrollbarMargin: 10, animateTo: true});
$('#list-'+count).fadeIn('slow');
if(autoScroll){
$pane[0].scrollTo($pane.data('jScrollPaneMaxScroll'));
}
}
);
});
</SCRIPT>
</HEAD><BODY>
<DIV class=scroll-pane id=mes></DIV>
<A id=add-content href="javascript:;">here</A>
</BODY></HTML> |
|
|
06.05.2009, 16:15
|
|
Интересующийся
|
|
Регистрация: 27.04.2009
Сообщений: 16
|
|
|
Все, разобрался, всем огромное спасибо =)
Дело было в самой библиотеке. Пример выше стопрацентнорабочий, поьзуйтесь, если кому понадобится =)
|
|
|
|
