忍者ブログ

Home > > 他人のFlashを勝手にjsで真似してみたらなんかいろいろ勉強になった

[PR]

  • 2017-01-18

Share on Tumblr このエントリーをはてなブックマークに追加

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

Comments:

Trackback+Pingback:

Listed below are links to weblogs that reference
[PR] from Born Neet

Home > > 他人のFlashを勝手にjsで真似してみたらなんかいろいろ勉強になった

Home > JavaScript > 他人のFlashを勝手にjsで真似してみたらなんかいろいろ勉強になった

他人のFlashを勝手にjsで真似してみたらなんかいろいろ勉強になった

Share on Tumblr このエントリーをはてなブックマークに追加

昨日の続き。はまったこととか、参考にした記事とか。
本編(?)では余計なことに時間かけすぎて、プログラミング的なことが書けなかったので…。

なんだかんだで結構勉強になりました。

興味のある人はどうぞ。

[改行されない…(Firefox)]

まずはまったのは、firefoxで●を入れたspanが改行されないという問題。

BugTrack-Fx2/54 - もじら組 Wiki にもあるし、バグっぽい?
ってことで、float:left;(必然的にdisplay:block;も)で応急処置…と思いきや、Element.style.float = 'left';ってやっても効かない!?

どうやら、

Element.style.styleFloat = 'left';	//IE
Element.style.cssFloat = 'left';	//Firefox

てやらんと駄目らしい。
UchのX40記: [JavaScript]DOM Elementのstyle属性のfloat

結局、 Firefoxで長い半角文字列が折り返されない(改行されない) -OKWave にある、​(ゼロ幅スペース文字というらしい)というのを挿入することにした。(存在自体始めて知った…)

なんか、改行のためにfloatを使うのは気持ち悪かったので。


[半透明にならない…(今度はIE)]

次は、IEで半透明が適用されないというバグ(?)に悩まされる。
もちろん、(opacityだけじゃなく)alphaフィルタを指定した上でですよ。

調べてみると、
IEにおいてfilter:alpha(opacity)を設定しても、currentStyle.hasLayout=falseだとが透明にならない。 - Enjoy*Study
なんだそうです。

ということで、zoom: 1;を指定して無事解決。


[おまけ]

地味だけど、document.createNodeは勝手にhtmlエスケープする
createTextNodeの挙動 - umezoの日記
なんてことも今さら認識。(文字参照が勝手にエスケープされてちょっと焦った)
そりゃそうだよな。


[その他の参考記事]

半透明なcssの書き方を確認
IE・Firefox・Opera・Netscape・Safariで表示可能な半透明CSS/Opacityテクニック - WEBデザイン BLOG

改行関連(​の名前とか、他の方法とかいろいろ参考に)
Mozilla-gumi Forum [One Topic All View / Re[1]: 自動折り返しの挙動 / Page: 0]
Geckoエンジンで長いURLとかを折り返し表示 - Lism.in * blog
ZERO WIDTH SPACE (U+200B) のエンティティ名ってないの? - daily dayflower
長い文字列の改行方法 - wbr, ­, css - World Wide Walker


以上。
これでいつでも水玉模様(『ドット柄(笑)』とか書いた方がいいのかな?)を作れますね。

…たぶん、二度と作りませんが。

PR

Comments:0

Comment Form

Trackback+Pingback:0

TrackBack URL for this entry
Listed below are links to weblogs that reference
他人のFlashを勝手にjsで真似してみたらなんかいろいろ勉強になった from Born Neet

Home > JavaScript > 他人のFlashを勝手にjsで真似してみたらなんかいろいろ勉強になった

Search
Loading
Feeds
Links
スポンサードリンク
Ad
デル株式会社
Ad

Page Top