javascriptにて中央配置のアルゴリズムをどなたか教えていただけないでしょうか。
下記のような例で要素を配置したいと考えています。
-要素が1つの場合 1-要素が3つの場合 123-要素が5つの場合12345
左右中央揃えにしたいです。ちなみにcanvasで生成したshapeを上記のような配置にしたいと考えています。canvas.width / 2の値に、要素の横幅/2したものをマイナスして〜という感じまではわかります。。どなたかわかる方いましたらお願いします。
アレってなんだよ。知らねー。
え、わからないですか?
テキストエリアへの入力値が常にテキストエリアの縦中央表示になるようにしたいって話?それなら、そんなライブラリを前に作ったわ。
わかんねーよw画像なり要素なりでってくだりが尚更意味わかんねーよw
テキストエリアにtext-align:centerを設定すると中央から配置されますよね。それをテキストではなくて、要素や画像で行いたいということです。
リッチテキストエディターを作るみたいな話?
みたいな感じです。左右中央配置のアルゴリズムが知りたいです。ちょっと質問文変更してみました。
逆に何がわからないの?一人で解決出来そうな感じは伝わってくるけども。
ちょっと考えてみます。。
すごいじゃん!サンプル見たよ!
text-align: centerを設定しても4 2 1 3 5みたいな配置にはならないのでは?もしそうだとしたら、「こんにちは」と入力したら「****には」と入力されることになる。ちなみに、好きな要素をtext-align: centerで並べられるようにしたければ、display: inline-block; をつけるといいよ。
おっしゃるとおりですね。。間違えました!ちなみにcanvasのshapeで実装したいと考えています。
要素を分解して、奇数と偶数で左右に振り分けたら良いのでは?
for文で回すじゃんんで開始ポイントはcenterX - (objectW*n+margin*(n-1))/2じゃないの?
ソレゾレの縦横高さをfor文で足して半分すればそれが真ん中だよ。
てかそれってfor文で回すんじゃね?
こんな感じになりました。ttp://jsdo.it/KURIRIN/IZTJ なんかもっとスマートにできそうな。。特にifで分けてるところです。皆さんならどうしますか?
プレゼンテーションはjavascriptで実装しない。特に今回の例はcssで十分。仮にmidiAPIとかと同期させるとしても、jsからのadd classで十分対応可能。
すいません、ご返答の内容が高度過ぎて理解ができなかったです。。まずプレゼンテーションとはどういったことでしょうか?教えて頂けると助かります。。
cssでできることをjavascriptで実装するに値する理由ありますか?ってことです。
理解できました。ですが、cssで実装する場合の方法がわからないです。。
みんなの回答 7 件
アレってなんだよ。知らねー。
text-align: centerを設定しても4 2 1 3 5みたいな配置にはならないのでは?
もしそうだとしたら、「こんにちは」と入力したら「****には」と入力されることになる。
ちなみに、好きな要素をtext-align: centerで並べられるようにしたければ、display: inline-block; をつけるといいよ。
要素を分解して、奇数と偶数で左右に振り分けたら良いのでは?
for文で回すじゃん
んで開始ポイントはcenterX - (objectW*n+margin*(n-1))/2
じゃないの?
ソレゾレの縦横高さをfor文で足して半分すればそれが真ん中だよ。
てかそれってfor文で回すんじゃね?
こんな感じになりました。ttp://jsdo.it/KURIRIN/IZTJ なんかもっとスマートにできそうな。。特にifで分けてるところです。皆さんならどうしますか?
関連するトピックス