2022.1.23 更新
皆さまごきげんよう。
本日はjQueryで座標を取得してみます。
今回作るものは、マウスカーソル (タッチデバイスでは指) を画面上で滑らせると、その軌跡に沿って★が描かれるというものです。
目次
1.座標を取得するには〜offsetとclientX、clientY
2.変数を定義する
3.clone関数で要素にappendToする
4.setTimeout関数とは
5.タッチイベントとマウスイベント
6.まとめ
7.コード
5G時代のwebはどうなる?トレンド好きの備忘録的徒然日記
2022.1.23 更新
皆さまごきげんよう。
本日はjQueryで座標を取得してみます。
今回作るものは、マウスカーソル (タッチデバイスでは指) を画面上で滑らせると、その軌跡に沿って★が描かれるというものです。
1.座標を取得するには〜offsetとclientX、clientY
2.変数を定義する
3.clone関数で要素にappendToする
4.setTimeout関数とは
5.タッチイベントとマウスイベント
6.まとめ
7.コード
2022.1.10 更新
皆さまごきげんよう。
本日は、前回のjQueryで雪を降らせてみようのファイルを元に、ワードプレスの背景に雪を降らせてみようと思います。
2022.1.29 更新
皆さまごきげんよう。
本日はjQueryで雪を降らせてみようの巻です。
今回はdivを雪の一粒に仕立て、jQueryでランダムな数値を取得・複製し、それをcssのアニメーションでループさせて雪を降らせてみようと思います。
今回作ってみるものはこちらです。
2022.1.30 更新
皆さまごきげんよう。
本日はjQueryとcssを連携させて、タブでページを切り替えて表示させてみます。
今回作ってみるものはこちら↓
2022.1.23 更新
皆さまこんにちは。
本日は前回の続き、Masonry.jsを使ってワードプレスにピンタレスト風レイアウトを実装してみます。
〜その壱〜を読んでいただくと理解が深まりますので、ぜひ目を通してみてくださいませ
Masonry.jsを使ってワードプレスにピンタレスト風レイアウトを実装してみよう〜その 壱 〜
さて、前回の設定だけでうまくいった方もいらっしゃるかも知れません。しかし私はこの後、投稿した画像が重なって表示されてしまうという現象に悩まされました。
そこで今回は、画像をきちんと読み込んでから表示させるような設定を追加します。
2022.1.23 更新
皆様こんにちは。
本日は、ワードプレスでピンタレスト風レイアウトに挑戦してみようと思います。
前回の記事「ワードプレスプラグインCustom Post Type UIの使い方」の続きになります。こちらを読んでいただくとより理解が深まりますので、ぜひ目を通してみてくださいませ。
さて、前回はカスタム投稿タイプでgalleryという投稿ページを新たに作ってみましたが、今回はそれをJSライブラリ「Masonry」を使って、コンテンツをレンガ状に並べて表示させてみようと思います。
ちなみにmasonryとは石工[れんが工]職、石[れんが]造りの建造物、石造建築っていう意味なんですね。
“Masonry.jsを使ってワードプレスにピンタレスト風レイアウトを実装してみよう〜その壱〜” の続きを読む2022.1.16 更新
皆さまこんにちは。
本日はskrollr再び!skrollrを使ってペラいちのランディングページを作ってみます。
まずはこちらにDEMOを作ってみましたのでご覧ください。
(※firefoxブラウザではきちんと表示出来ないかもしれません。その際はお手数ですが他のブラウザでお試し下さいませm(_ _)m )
パララックス(視差)効果で立体感のあるページが簡単に作れるJavaScriptライブラリです。スマホにも対応してます。まずはダウンロードしてみよう。
2022.1.16 更新
皆さまこんにちは。
本日はパララックス(視差効果)が簡単に実装出来るskrollrというライブラリをを使ってみましたので、ご紹介しようと思います。
デモを作ってみましたので、こちらをご覧下さい。
“パララックスが簡単に実装出来る!skrollrの使い方” の続きを読む