creativePageScroll

おはようございます。

そろそろDMM英会話の先生を毎回選ぶのがしんどくなってきましたどうもハヤトワンです。

美人で気遣いのできる先生は当たり前に人気で予約がムズカシイ

ということで、今朝のコーディングと英語

▼コーディング

https://github.com/HayatoMoromasa/sample/tree/main/creativePageScroll

    <script type="text/javascript">
        let progressbar = document.getElementById("progressbar");
        let percent = document.getElementById("percent");

        let totalHeight = document.body.scrollHeight - window.innerHeight;
        window.onscroll = function(){
            let progress = (window.pageYOffset / totalHeight) * 100;
            progressbar.style.height = progress + "%"
            percent.innerHTML = "Page Scrolled " + Math.round(progress)+ "%"
        }
    </script>

Element.scrollHeight – 読み取り専用のプロパティで、あふれて画面上に表示されない部分を含めた、要素の中身の幅の寸法

window.innerHeight – 同じく読み取り専用プロパティで、ウィンドウの内部の高さをピクセル単位で返す

Window.pageYOffset – 垂直方向のスクロール量

Math.round() – 引数として与えた数を四捨五入して、もっとも近似の整数を返す

これらを各々置き換えたら、ほうほうなるほどとなるやつ。

▼英語

Are you ready?に対して

Yes I am ready

countryside:田舎

Do you have any question?に対して

I don’t have any questions

He lives in London.

sをちゃんとつけなさい

Because he enrolled at a university

whyにはbecauseをつけようね

enrolled:登録済み

His hometown is famous for cheese.:彼の故郷はチーズで有名です。

whole:全体

upper side:上部

It is very comfortable weather:とても快適な天気です

It is easy to live.:住みやすい

Historical figure:歴史上の人物

ということで、昼からブレイキンの練習！

今日も良い一日を！