質問: $(緑div).width() + $(緑div).scrollLeft(); if((scrollWidth -left) / scrollWidth <= 0){ // 緑の一番右端を超えた! // 右端の数字がわからないので、試験的に500ぐらい戻してみる $this.scrollLeft(left-500); $(緑div).scrollLeft($this.scrollLeft()); } }); ``` デバッグするとちゃんと右端判定のif文には入っているのですが、 スクロールバーが戻ってくれませんでした・・・。
回答: いまさらながら自己解決しました。 ``` $(オレンジdiv).scroll(function(){ $this = $(this); // 一旦横スクロールを連動させる $(緑div).scrollLeft($this.scrollLeft()); // 緑divの右端を通り越してないかのチェック var scrollWidth = $(緑div)[0].scrollWidth; var left = $(緑div).width() + $(緑div).scrollLeft(); if((scrollWidth -left) / scrollWidth <= 0){ // 緑の一番右端を超えた! // window幅分を引いた位置に調整する $this.scrollLeft(left-window.innerWidth); $(緑div).scrollLeft($this.scrollLeft()); } }); ``` 質問に記載していた、 「緑divの横幅までスクロールしたらそれ以上右に行かせない作戦」 で、ヘッダー部の一番右端までスクロールしたら、現在のスクロール位置からwindow幅を引いた分だけ戻すようにしたら、理想の動きになりました。 当初、どのぐらい引いたらいいのかわからず500とか1000適当な数字を入れていたのですが、ふと時々うまく動いていることに気がつきました。 カンで「もしかして動かしてるときのWindowサイズか?」とあたりをつけて、winodw幅を引くようにしてみたらうまく動きました。 算数力のない私にはなぜこれで動いたのか理解できないし、汎用的な解なのかもよくわかりませんが、とりあえずこれでクローズにします。