トップへもどるわぷー 上からふわっと出てくる。スクロールするとゆっくりついてくる。下までいったら位置固定でふわふわする感じ（jQuery実装）

[mignonstyle]

No description provided.

[inc2734]

下まで行ったときにふわふわは結構難しい + わぷーが下まで降りきっていないときにスクロールをやめたときに、わぷーがふわふわしたほうが良い、と思ったので、つねにふわふわするように実装しました。おかしくないか確認お願いします。

[mignonstyle]

ずっとふわふわ可愛いです！ありがとうございます。

[mignonstyle]

「上からふわっと」と「スクロールするとゆっくりついてくる」もjQuery実装なのですがお願いできますでしょうか？イメージは以下のようになります。

・上からふわっと出てくる
「ふわっと」はこんな感じです → http://www.webopixel.net/lab/sample/12/0308scrollshow/pagetop-fade.html

「出てくる」はこんな感じです → http://www.webopixel.net/lab/sample/12/0308scrollshow/pagetop-move.html
サンプルページでは下から出てきますが、これが上から出る感じ

・スクロールするとゆっくりついてくる
こんな感じです（サイドバーがついてくる） → http://memocarilog.info/memocarilog-demo/froat-menu/index.html

スクロールしてもついてくるサイドメニューをjQueryとCSSで作るチュートリアル
http://memocarilog.info/jquery/3100

スクロールより少し遅れてついてきて、ブラウザの下まで行ってから位置固定になる感じです（今は下まで行く前に固定位置についてしまう）

[inc2734]

今はスクロールに連動して動くようにしているのでスクロールをやめたら上下移動は止まってしまいますが、それを常に遅れて下まで移動するようにする、ということですかね？

スクロールより少し遅れてついてきて、ブラウザの下まで行ってから位置固定になる感じです（今は下まで行く前に固定位置についてしまう）

僕のブラウザ（chrome）だと下まで（正確にはbottom: 10px）いくと固定されるようにしていますが、もっと上で止まってしまっているということでしょうか？

[mignonstyle]

常に遅れて下まで移動するようにする、ということですかね？

動くのは「スクロールに連動して動く」で良いと思います。
今はスクロールしていくと、途中でスクロールバーのノブのところを追い越して、ノブより先にブラウザ画面の下にたどり着いてしまうので、ノブを追い越さないように（スクロールバーより後で追いかけてくる感じ）なると良いかと思います。下記の件とも関連あるかと思われます。

僕のブラウザ（chrome）だと下まで（正確にはbottom: 10px）いくと固定されるようにしていますが、もっと上で止まってしまっているということでしょうか？

私のブラウザ（FireFox）ではタイムラインのアイコンの所で、わぷーがブラウザ画面の下までたどり着いて固定位置になってしまっています。こちらは環境によるものでしょうか？

[mignonstyle]

今はこのようになってますー（スクロールバーのノブより先にわぷーが画面下にたどりつく）

[inc2734]

今修正していたのですが、この修正も間違ってますね(**; 0a716d0
つまり、スクロールの動作が開始してコンマ数秒後にわぷーもスクロールを開始し、常にスクロールバーと同じ位置で固定される、ということでしょうか…？

[inc2734]

ページを表示した段階（スクロール位置が0）のときはわぷーが画面外にいますが、スクロールすると入ってきますよね。で、一旦下にスクロールしてから、また最上部までスクロールさせたとき（スクロール位置が0になったとき）だけは、またわぷーも画面外にでていくのが正しいです？

[mignonstyle]

お手数おかけしてすみません。

スクロールの動作が開始してコンマ数秒後にわぷーもスクロールを開始し

はい。そのようにお願いします :）

常にスクロールバーと同じ位置で固定される

常にスクロールバーと同じ位置というわけではないかと思いますが、「スクロールバーのノブは追い越さない」事になるかと思います。

こちらのデモページでは、ノブの横あたりだったり、ノブより少し上だったりします。
http://memocarilog.info/memocarilog-demo/froat-menu/index.html

[inc2734]

提示いただいたでもページだと、スクロールバーの位置はあまり関係なく、スクロールが0のときはブラウザ上辺から100px、それ以外のときはブラウザ上辺から70px の位置まで遅れてスクロールしてきて固定される、ではないですか？なので、例えば少しだけスクロールして「Floating Box」の文字がブラウザ上辺にくるくらいの場合はスクロールバーの上辺よりSidemenuの位置が下になっています。

[inc2734]

今回のpagetopの場合はページ最下部にいったときは最下部に固定、ページ最上部にいったときはわぷーが画面外に外れる位置まで動いて固定、というふうにブラウザ上辺から◯px・ブラウザ下辺から◯pxというわけではないので、もう少し動きを細かく検討しないといけないような気がします。（僕が難しく考えすぎているだけの可能性も高いので、スクロール位置を何箇所が区切ってその場合のわぷーの位置を示した仕様書などがあるとすごく助かります）

[inc2734]

5829cab
スクロールバーの位置と連動させたサンプルです。ページ最下部までスクロールしたときの位置決め処理がまだ甘いですが…

[mignonstyle]

サンプルありがとうございます。
すみません、ちょっと動きを整理してまとめますので一旦お待ち頂けますか？

[inc2734]

はい、よろしくお願いします！

[mignonstyle]

お待たせしました。
「スクロールに連動して動く」という認識が少し違うのかなと思ったので、ちょっと整理しました。
こちらで確認してみていただけますか？不明点などございましたらご質問ください。

[mignonstyle]

わぷーの表示位置が仕様書と違っていて、ページを表示したときにわぷーが表示されないのですが、まだ作業中でしょうか？

[inc2734]

すみません、まだ手つけられてないです（@@;

[mignonstyle]

了解です！ありがとうございます。
作業が一旦済んでこちらで確認したほうがよい時は担当者を変更しておいてください。

[inc2734]

@mignonstyle 変更してみました、確認お願いします！つ https://github.com/WordBash/kyoto-vol1/tree/issues/%2321

[mignonstyle]

ありがとうございます！動きはこれで完璧です！！可愛い！

すみません、2点だけ気になったのですが（仕様書に書いてなくてすみません）

・「Topへ」の吹き出しはスクロールUpしたら「About WordBash」のアイコンあたりでフェードアウトさせてください。（「About WordBash」のアイコンのあたりを起点としてスクロールdown、スクロールupでフェードイン、フェードアウト）

・ページが表示されたときのわぷーの位置が上から200pxのあたりですが、（吹き出しが表示されたら120pxになるようになってる）、吹き出しがないときも上から120pxになるように調整は可能でしょうか？

動き自体はとても良いので、マージしちゃっても大丈夫だと思います！
上記2点だけよろしくお願いしますー。

[mignonstyle]

わぷーの位置はこんな感じになるといいと思います。

[inc2734]

反映してみました。確認お願いします！ @mignonstyle

[mignonstyle]

ありがとうございます！完璧です！わぷー可愛い！さすがキタジマさん！！
こちらでOKですのでよろしくお願いしますー :）

[mignonstyle]

すみません、質問なんですが、
わぷーがブラウザの下の固定表示のときに、ウインドウ幅を変えると、
わぷーが一瞬ウインドウから消えて、下から飛び出してくるのはそういう仕様ですよね。
（↑直してほしいとかではなくて、どうしてそうなるのかな？という疑問です。）

ウインドウ幅を変えてスクロールの位置が変わるから、位置を再計算してるのでしょうか…？

[inc2734]

ウインドウ幅を変えてスクロールの位置が変わるから、位置を再計算してるのでしょうか…？

僕もはっきりはわからないのですが、通常上から 120px で、スクロールバーが最下部のときだけ条件判定して下から 90px（実際には上から◯pxの指定ですが）としているので、スクロールバーの位置がかわることで再計算が発生しているのかなと思います。

[mignonstyle]

なるほどです。ありがとうございます。こちらはFixでお願いします！