横スクロールサイトを作っています。嫌いにならないで!dom scrollLeft プロパティが変更されていないマウスダウンで mousemove イベントをバインドする場合を除いて、すべてが正常に機能しているようです。「moving」と「mouseup」はどちらも適切なタイミングでコンソールに書き込まれています。これが私のコードです...編集:また、マウスダウン時にコンソールに $('#container').scrollLeft を書き込むと、値の代わりに「関数()」が返されることに気付きました。
$(document).ready(function() {
$('#container').mousedown(function(event) {
$(this)
.data('down',true)
.data('x',event.pageX)
.data('scrollLeft',this.scrollLeft)
.css({'cursor':'url("http://www.loodieloodieloodie.com/images/closedhand.cur"),auto'});
$('body').bind('mousemove',function(event) {
console.log('moving');
$('#container').scrollLeft = $('#container').data('scrollLeft') + ($('#container').data('x') - event.pageX) * 2;
}).bind('mouseup',function() {
$('#container')
.data('down',false)
.css({'cursor':'url("http://www.loodieloodieloodie.com/images/openhand.cur"),auto'});
console.log('mouseup');
$(this).unbind('mousemove');
});
return false;
}).css({
'overflow':'hidden',
'cursor':'url("http://www.loodieloodieloodie.com/images/openhand.cur"),auto'
});
});
ここに基本的なhtmlがあります...
<body>
<div id="container">
<div id="inner">
CONTENT
</div>
</div>
</body>
助けてくれてありがとう、B