matumaeduke のすべての投稿

firefox 画像だけを別タブに表示

開発でもなんでもないのですが

firefoxで画像だけを拡大・縮小したい場合、画像を右クリックしてポップアップメニュー内の「画像だけを表示(i)」するのが一般的だと思いますが、そうすると見ているページのそのタブが画像だけに切り替わるのが気に食わず、別タブで画像だけ表示してくれればいいのに・・・「画像だけを表示(別タブ)」とかメニュー無いのか

とかずっと思ってた。調査したらすぐ意外な方法で別タブで表示してくれることが判明。

1)画像を右クリック
2)表示されたポップアップメニュー内の「画像だけを表示(i)」をマウスホイールの中クリックする
3)別タブで画像だけ表示される。

20151218firefox画像別タブのコピー←右クリック&「画像だけを表示(i)」を中クリックしてみよう

これで目的のムフフ画像リストページから別タブで表示して拡大縮小、見終えたらタブを閉じて次のムフフ画像へと・・・
いやなんでもない・・・色んな知らない機能があるものだねえ

あとこれが効果的な場面がツイッターとかで画像クリックした場合CSSレイヤーのウィンドウ表示みたいになったりするけど大きさが画面サイズに合わされて小さかったりするから画像だけ表示にするけど、
1)タイムラインがから画像をクリック
2)出てきたレイヤーウィンドウ内の画像を右クリック
3)ポップアップメニューの「画像だけを表示(i)」
4)見てたタブが画像だけになる
5)タイムラインページに戻ると見てたタイムラインがずれる
↑これが基本的に嫌だから別タブで開きたいんだよね。

でもマウスホイールの中クリックでもいいけど、なんだか慣れないせいかクリックが不安定。できればポップアップメニューに追加できないかなぁ・・・

※追記
普通のアンカーリンクを中クリックでも別タブで開いてくれるのね。
いつも右クリポップアップリンクを新しいタブで開く、でやってたよ。
リンク付き画像だとリンクが優先されるもよう。あとマウス位置でのスクロールになる場合もある。
場合分けが表示しているサイトのページによって違ってよーわからん。tabmixplusの設定とかもあるんかな。メンドクサクて調べない。。。ってことやってるから皆が知ってる機能でも知り得たときに、おー!、とかなるんだろうなぁ(反省・・・するのか?

wordpress4.4 embed機能のテスト

wordpress4.4で記事投稿欄にURLを貼るだけで対応していればツイッターカードやブログカードのように表示してくれる機能、embedが使えるようになったようだ

wordpressプラグイン:麻雀牌プラグイン

おーできた。見目美しいな。

んー?でもこれURLを単なるURL文字列として表示したい場合どうすりゃいいんだ??wwwあとで調査して追記するわw

※追記

 http://mayoi-dev.wslab.net/archives/241

1行にURLだけであればカード化する、そのほかの文字が入っていたらカード化しないらしい。↑はURLの前に全角スペースいれてある。

行の途中にどうしてもカードを入れたいのであれば
[embed]URL文字列[/embed]←カッコは半角
すればいい

たとえば

wordpressプラグイン:麻雀牌プラグイン

こんなふうに.

ちょっとまてw[embed]←カッコは半角 記事中にこれ書けなくなったじゃんwどうすんだwさらに調査w

wordpressプラグイン:麻雀牌プラグイン

趣味でネット麻雀やっててなんだか初心者さんにあー画像付きで牌並べて説明したいなあと思ったりしたのだけど
あれ?もしかしてwordpressで麻雀牌並べるようなプラグインあるんじゃね?ってさがしてみたらあったあったありました。
麻雀牌プラグイン
http://wordpress.1000sei.com/mahjong/

趣味と実益を兼ねて麻雀ブログでもはじめようか、いやサイト1個作るほどのことでもねえな・・・ならこのブログでやろうかとか思ってしまった私を誰が責められようか(いや責められない)(反語)

つうかちゃんと仕事と勉強しろよっていう・・・

Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(ほぼ総括)

私が総括したわけではないーw 感謝感激おれ秀樹

もずはっく日記: Bug-org 1194055 Size of <input> elements has changed in Firefox 40
http://www.d-toybox.com/studio/weblog/show.php?mode=single;id=2015081600

一番くわしく纏められています。

  1. 障害は日本語windows7,vistaだけのもよう
  2. font-familyの設定をするのではなくwidth,max-widthを設定すべきとのこと
  3. firefox41で修正可能性があること(されない可能性も多分にある)

こーすりゃいいあーすりゃいいなんて一概に言えないなあ。
win7,vista+firefox40の場合のみ発現するなら切り捨てるか個別OS対応するかしてもいいとも思うが今後またへんなシステムフォントを引っ張ってこられてもデザイナーはOSごとの対応迫られて困るわけででもそれはOSのリソース使う以上しかたのないことで→(ループ)

レガシーなメンテナンスほとんどしてないようなウェブサイトや社内ページも保守できたらいいけど全部が全部メンテできるわけでもなく一サービス利用者なだけだったら文句もなかなか通らず、でもそんなメンテしてないとこ使うなよといわれるかもしれないけど必要なサービスなら使わないといけないしさらになんかwikiとかでも問題になってるところがあるらしいし。。。

んーわからんw場末のこんな未熟者が考えてもどうしようもないですね。

旧来OS・システム・ブラウザの挙動・フォントなどなど私は全然知識が足りて無くどうすればいいのかわからんけど、まあ取り急ぎ有益な情報なので。充分自分だけが対応するには助けになります。改めて感謝

 

(2015/08/20 ※追記)
width,fontが設定されて無いフォームについてMS Shell Dlg 2というフォントの平均サイズにてフォームを表示させる対処をする方法が提案・検証されているようです。メイリオの平均サイズがあまりにいままで(MS UI Gothic)と違いすぎるのが問題視されての処置だそうです。少々大きくなるようですがさほど違いが無いらしいらしいらしい…(検証せんの?m(_ _;)m)

(2015/08/28 ※追記)
firefox40.0.3がリリースされました。さっそく更新して自分のレイアウト崩れたサイトみてみたところほぼinputタグの大きさは元通りになっていました。これにて解決です。少々Firefox39から大きくなるとの情報は得ていますが、概ねあまり変わらない程度にまでなったことを確認して一連の事象はFirefox40~Firefox40.0.2までのものと思って解決になります。

Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(※2015/08/15 22:30追記)

んーまだよくは分かっていない。
おさらいとして現象:windows7+firefox40に更新すると<input>要素などの横幅が2倍近くに広がってしまうサイトがある。

私の場合いままで自サイトではcontainerからのフォント指定を継承してメイリオ指定していたのだけど、入力フォントとして扱われずMS UI Gothicが入力用に使われていたのだと思う。
だもんで、単純にサイト製作者側としての対応としてはCSSにて

input{ font-family:MS UI Gothic; }

もしくはtype指定で

input[type=text]{
font-family:MS UI Gothic;
}

とすればwindows7+firefox40での表示は元通りではある。(自サイト+windows7+firefox40で検証済み)
けれどもmac,win10,win8とかは比較検証機材が無いため表示するとどうなるかわからん。
むしろ今までどう表示されていたのかも知りたいところではあるw
もちろん昔からある手入れがあまりされてないようなサイトを表示する場合でもwindows7+firefox40では問題が残り続けるでしょう。
あと社内イントラネットのページもレイアウトが崩れる場合があるので(特に社内だけだと手を抜き易いw)firefoxを許可してる会社でもfirefox40への更新ちょっとまった!状態になるとおもう。

不確実な情報なのであまりよくわからないが原因はなんかメイリオとMS UI Gothicのフォントの横幅の差が酷いらしい。

いくつかあるブラウザの表示差異を埋めるだけでヒーコラ言ってるので、できればOSでの違いまで考慮したサイト作りをさせない方針が示されることを望みます。また何か進展があれば記事を上げます。

(※2015/08/16 21:00ぐらい追記)
fontを決め打ち指定でなくwidth,max-widthをinput要素に指定する方法が提案されています。詳しくは↓で。
Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(ほぼ総括)
http://mayoi-dev.wslab.net/archives/217

Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(※2015/08/14 04:00追記)

やはり問題になってますね。firefoxデフォルトのinput textarea select 内のフォントがMS UI Gothic→メイリオに変更された為ということらしい。
うちのサイトではcontainerにメイリオ指定いままでしててそれが要素に継承されてたはずなんだけどなあ
どうも今まではinput要素そのものにスタイル指定していない限りinput要素があった→中身の文字はMSUIgothic となってたのかなぁ?
どちらが正しいかっつーと今が正しい表示されてるってことか?いやいやwin10やwin8で今まで通り見えてるんだからそれはないか
深まる謎をかかえたまま3日目へ・・・

あとmozillaでのこれの話題。一人現況説明と対応をがんばってる方に感謝と激励を送る。
796 :名無しさん@お腹いっぱい。:2015/08/13(木) 15:06:57.81 ID:8DV7rnJz0
40.0でレイアウトが崩れたサイトがある

Bug 1194055 – Size of <input type=”text” /> elements has changed in Firefox 40

https://bugzilla.mozilla.org/show_bug.cgi?id=1194055

 

(2015/08/14 11:00)
firefox40.0.2が公開されてますね。拙速な行動に定評がある私が更新を試してみましたが、レイアウト崩れは修正されてないようです。継続で。

Firefox40に更新してみたら表示不具合?

firefox40がリリースされたとの事で早速更新してみたのだけど、サイトのhtml中のinputボックスとかselectタグのプルダウンメニューの表示が今までと違ってなんだかおかしい。
inputボックスはサイズがおかしいし、プルダウンメニューはメニュー選択項目にマージンかかってるように隙間が開き過ぎる。
デフォルト入力文字のフォントもなんかおかしいきがする。sizeが効いていないかんじ?

IEとの表示差を比べてみた。2chですらこんなかんじにレイアウトが違って見える。ブラウザ違うからとかでなく以前のバージョンと比べれたら一番よかったのだが、自分のサイトも表示崩れてしまっている。バグならバグで早急に修正してもらいたいのだけどこれが仕様だと言われたらサイトも手直ししなきゃいけないが、なぜか幾つかの同様の報告以外情報が得られない。
firefox使ってる全世界中で確認されていて文句出ていてもおかしくはないというのに。

仕様かバグかだけでもハッキリしてほしい。続報・継続調査で。

20150812iefirefox40

(※2015/08/13追記)
さて1日経過したわけですが同様の症状が出てる人もちらほらネットで見かけます。
今のところwindows8.1,windows10では問題なく、windows7,windowsVistaで正常表示されていないようです。fontが勝手に変わっているとかなんだかOS,fontなにかそのあたりに原因がある模様
また継続調査で。

文字列の短縮

ダラダラと長い文字列をサイトのブロック要素にぶち込んで並べた場合に、文字列の長さによってブロック要素の大きさがまばらでなんだか格好が悪いので長い文字列の短縮をしましょう、ということで。

$strtitle = mb_substr($title,0,30,"UTF-8");
if ($title<>$strtitle) $strtitle.="…";

最長の文字列とブロック要素の大きさを調整して表示すると綺麗に並べれて美しくなるよ

20150722雑記 AccessAnalyzer障害対応法の調査

適当にAccessAnalyzerがログ取得遅延を起こした場合の対処法をネットなどで調査した。
まああまり褒められた手法でもありませんし・ホントにこれで改善するのか?というものまで。
まあ話半分ネタだとおもってw

■■1)解析タグを自ページの最後のほう下方位置の移動する

これはまあ障害が起きる前にほんとはやっておくべきことなのですが、
ページの先頭、bodyタグのすぐ下なんかに置いたら目もあてられません。自ページ全ての表示が遅延してしまって白いページで待たされるような事が発生する可能性があります。
フッターあたりにでも置いていたら解析タグがあるところまではさっさとブラウザは表示してくれるはずなのでフッターもしくはそれ以下の部分に解析タグを設置することをお勧めします。
まあたしか設置説明書みたいなのにはなるべく上方などと書かれていた気がしないでもないのですが情強のおれは騙されません(ほんとかよ?w)

■■2)設置タグに書かれているURLのサーバ記述を変更する

http://j1.ax.xrea.com/l.j?id=(サイトID)
http://w1.ax.xrea.com/c.f?id=(サイトID)

http://j2.ax.xrea.com/l.j?id=(サイトID)
http://w2.ax.xrea.com/c.f?id=(サイトID)

設置タグに書かれているURLのj1,w1をj2,w2に変更する。
鯖の二重化がされてるそうでj1,w1サーバが障害になっても対応できるそうです。
でもユーザ手動でタグを書き換えってw
私は試していません。結局同じように障害になる可能性が否定できないので。特にアクセス遅延の場合アクセスが集中して起こる場合が多いので手動で切り替えなんてやってられっかってかんじですw

■■3)設置タグのスクリプトをasyncにする

<script type=”text/javascript”><!–

<script type=”text/javascript” async><!–

なんかネットでみかけた。非同期にしたらいいよ!ああそうなんだ!えー結局遅延してんじゃんとか思った。
まああまりタグの改変はお勧めできんし、こっそり私がやってみた結果変わらん気がするし問題も解決しなかったように思う。
続くなんだIDやらADやらFRAMEやらの変数数値もどっか別のスクリプトで書き換えられても動作おかしくなるらしいし。

■■4)携帯用タグを使う。

<a href=”http://w1.ax.xrea.com/c.f?id=(サイトID)” target=”_blank”><img src=”http://w1.ax.xrea.com/l.f?id=(サイトID)&url=X” alt=”AX” border=”0″></a>

一番現実的で有効な対処でそしてガッカリw PC用とはちがってjavascriptは一切使ってない。偽装の画像イメージが表示される事でログを取得してる。
スクリプトのアクセス遅延だけの場合これはすごく有効。サイトページ表示も速い。
問題点は2つ

  • 結局こっちもアクセス遅延したら一緒じゃん
  • リファラが取れず何処から自分のページへ飛んできたか分からない・画面サイズ・閲覧者IDも取れない。一見上手く動いたようにみえてその実得られるアクセス解析のデータは削られ正直、アクセスがあった!○件!しかわからない。これではアクセス解析というよりアクセスカウンタである。

あと画像にアンカーリンク張ってあるけどnofollow属性もつけてほしい。なんか損してる気分にもなる。

■■5)自分でアクセス解析を作る。

これ一番お勧めできるw信用のならんサービスを使用するより自分の利用してるサーバが生きてる限り使えるw
他人のアクセスやら他人へのDOS攻撃でサービス遅延起こすサービス使うよりも「自分の事は自分で」精神でw
(まあ自分のとこがDOSされたら対処も自分でやらないといけないけどw)
私みたいに詳細な解析結果を必要としない人でプログラムに自信がある人はやってみたらいいんじゃないかと思うよ。どうせ自分に必要なところしか作る必要もないのだし。
少なくとも上記携帯用タグで得られる情報までは簡単に昨日1日で作れた。
まあ自分で保守で解析画面作る手間も発生するが楽しんで作ればいいんじゃねえかともおもう
いいものができたら俺にもつかわせてくれw