フロントエンド技術

フロントエンド技術

querySelectorで要素の有無を調べ、if文で分岐させる

javascriptにはquerySelectorという要素を取得するためのメソッドがありますが、これがif文と組み合わせて、要素が存在するかどうか調べた上で分岐させることができるんですね。 if(document.querySel...
フロントエンド技術

ループスライダー作りました

仕事が終わったあとにGitHubで少しずつ作っていたスライダーをとりあえず公開しました。最低限の機能しかありませんが、一応ループします。作り込めばもうちょっと高機能にはできるけど、Swiperには敵いません。
フロントエンド技術

CSSアニメーションで遊び始める

こんばんは世界! 今までCSSのアニメーション機能をほぼ使ってこなかったから、全く作り方を知らなかったんだが、CodePenを見ていたら、なんとか作り方は理解したから超簡単なアニメーションを作ってみたよ! ヒーローが泥棒を成敗するア...
フロントエンド技術

中央揃えで文字列を左寄せにするやり方 HTML&CSS

デザインを元にHTMLコーディングをしていると、多種多様なシチュエーションに遭遇し、それぞれ対処していくことになる。普通、テキストの中央揃えをすると下の画像のようになると思う。 text-align:center;というCS...
フロントエンド技術

javascriptでスクロールと連動して下線が引かれる仕組み

最近スクロールと連動してテキストに下線を、アニメーションして引かせるコードを書く機会があったよ。 スクロールは何度もやってきたのでやり方はわかっていたんだが、下線をアニメーションで引かせるのをどうやるのかと思っていたところ、...
タイトルとURLをコピーしました