「Bootstrap」でフォームを書いたのは、職場でヒマだった時にお遊びで書いてみたくらい。
相変わらず正しい書き方ってのがイマイチよくわからんけど、コメント用のフォームはこんな感じでいいのかな。
で、CGIの方もいくつかをやっつけで修正、何となく動いているような気がするから、これで終わりにしてしまおう。
真面目にやると、文字コード云々とかが結構大きな壁になる気がしているので、ここは必殺「見なかったことにする」ということで。
2016/01/24 ここから先を追記
何だかんだで、無理やり削除機能っぽいものも突っ込んでしまった。挙動が怪しい気がするけど、深く追求はしない。
スマホのブラウザでwindow.open()
とかやると、こんな状態になるのね。あんまり適切な手法ではなさそう。
あ、ブラウザはAndroid 4.0.4のデフォルトのブラウザです。Chrome入れても、使い物にならないくらい遅い。
「Android window.open()
」とかで調べると、結構ややこしい話になっている模様。よし、メンドい箇所は考えるのを止めよう。
mixiチェックのボタンが微妙にズレるという問題に対して、何とか手抜きで解決できないかを試行錯誤してみる一日。
自分が使ってるCSSの問題かとも思ったけど、空のHTMLに対してmixiボタンを貼り付けただけでズレる。俺のせいではなかった。
結局のところ、<iframe>
に対して情報を埋め込んでいるだけなので、そこをjQueryで何とか書き換えられないものか。
$(document).ready(function() { $("iframe[id^=mixi-check-iframe]").contents().find("p").css("top", "0px"); });
mixiチェックボタンを配置する際に生成される<iframe>
は、どうやら表示する度にidが変わるらしい。
3~4ケタの数値が「mixi-check-iframe」の後ろに付与されるので、ワイルドカード指定で、コンテンツの表示を変更したい。
ってか、ちょっと考えてみたら、クロスドメインだから出来るはずも無かった。Chromeで動かしてみたけど、案の定ダメ。
Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "http://www7a.biglobe.ne.jp" from accessing a frame with origin "http://plugins.mixi.jp". Protocols, domains, and ports must match.
http://plugins.mixi.jp/share_button.pl?u=<URL>&k=<識別キー>&b=<ボタンの種類>&s=<吹き出し表示有無>
上記URLが<iframe>
の中に仕込まれて、ボタンと吹き出しを取ってくるんだけど、その中身のHTMLを操作したかった。
HTTPの応答ヘッダを覗いてみたら、Access-Control-Allow-Origin: http://mixi.jpと指定されているので、外から触るのは無理か。
ボタンの高さは20px、<iframe>
内の<p class="count">
の吹き出しの高さが20px、そこにtop: 2px;
が指定されりゃ、そりゃズレるわ。
しかも、何を勝手に数値に対して<strong>
とか指定してるわけ?こういう箇所はパラメータで利用者側に選択させてくれよ。
ボタンの種類はいくつかあって、高さ18pxのものはtop: 0px;
、高さ25pxのものはtop: 6px;
、高さ20pxのものはtop: 2px;
の模様。
どのボタン形式を選んでも、吹き出しの高さは20pxから変わらないんだから、高さ20pxのものはtop: 0px;
であるべきなんじゃないの?
そもそも、カウント表示時に要素を水平に並べるという行為が間違っているんだろう。吹き出しは上に出すべきかね。
あ、そうそう、吹き出しを表示させてみたら、いくつかのページが「Pocket」に追加されてた模様。ちょっと嬉しい。
2016/01/30 ここから先を追記
<iframe>
の中のCSSを直接触ろうとするから怒られるのであり、<link>
でCSS参照を追加してみるのはどうだろう。
と思って試したんだけど、まあ結果は変わらないよね。世の中の人々は、どうやってこういう問題を解決してるんだ?