ねごとめも背景

ねごとめも

数学、電気の勉強始めました!プログラムにも挑戦しています!|ω・)ノ


作成したプログラムは、こちらでも公開しています。
よかったら覗いてみてください。_(┐「ε:)_
→ javascript,SVG で作成したプログラム置き場

Selection, Range : Lilac

シンガーソングライターの美波さんの
新曲 「 ライラック 」 がYouTubeに公開されています。

そのMV中、文字が移動しながら、パラパラっと入れ替わる
テキストアニメーションがあります。
その動作とテキスト選択のイベントと組み合わせてみました。

contenteditable="true" のテキストエリアを配置して
selection,range で文字の位置を取得しているのですが、
それぞれのブラウザで返ってくる値が違ったりします。
chrome, firefox は、問題なさそうな感じです。

edge では、選択でハイライトされている範囲と
返ってくる値が違ったりします。
それより、 console 出力のラグが。。。。(:3_ヽ)_

テキストの描画は、DOM オブジェクトをイメージに置き換えて表示しています。
chrome では、テキスト描画要素とテキスト選択要素にズレが出てしまい
1px の margin を指定する必要がありました。
firefox, edge は未確認。
動作 : chrome のみ

See the Pen selection, range : Lilac by negotoy (@negotoy) on CodePen.



2018/06/20 [00:25]

object, array : コピー、クローン テスト(b)

前回作成した、object, array 配列をコピーするプログラムでは、
arguments を変換した場合、object, array の容器?外側?を
作り変えてしまうので、参照が切れてしまいました。
なので、参照が切れないように修正しました。( ˘ω ˘ *)



2018/06/10 [23:20]

カウンター

プロフィール

negotoy

Author:negotoy
電気の勉強始めました!
テキストエディタを使ってプログラミングに挑戦中。fc2 ブログに公開しているテンプレート等は、自由にカスタマイズして、ご活用ください。プログラム実行の前に必ずコードの確認をお願いします。

最新記事

カテゴリ

カレンダー

05 | 2018/06 | 07
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30


PAGE TOP
広告: