徒然 - 2009 12月 20

きょうは、体験するつもりだった。
だけど、日本演奏しなかったよ。

*このエントリは、ブログペットの「つとむ」が書きました。

方法で、

JavaScript を使わない、簡単なやり方を見つけました＼（＾＾）／

（と書き始めたものの、この記事は相当苦労して書きました、、、ー。ー；）



まずは、



（mixi に転送されたものはうまくいかないと思いますが）




参考にしたのは、「文字の置き換え」というページで、

上の仕掛けは、次のコードで書かれています。
<div onclick="this.innerHTML='ピョン　ミヾ( ﾟ∇ﾟ)ツ'" 
style="
text-align:right;
font-size:large;
font-weight:bold;
color:#006600;
">
<div style="
text-align:left;
font-size:large;
font-weight:bold;
color:#FF0000;
cursor:pointer;">ここをクリックしてみてください！！</div></div>


ただし、このブログは WordPress を利用しており、

改行部分は自動で「<p>～</p>」と変換されるので、

参照サイトの「p」の部分は「div」にしました。

（「<p>」～「</p>」の中に「<p>」～「</p>」を入れることはできない。

【追記】表示はできるけど、クリックに対しては反応しない）



色の付いた部分は（mixi では色はつかないと思いますが）、

赤字がクリック前、緑字はクリック後の、

文字の色、表示位置、ポインタ形状の指定部分、



太字が（mixi では太くならないと思いますが）、

クリック前と後に表示される文字です。




また、これをブログで記述する際、

たいていは初期状態で「改行を<br>に変換する」になっているものが多いので、

上のソース表示は見やすくするために改行を入れましたが、

ブログに書く際は改行部分を半角スペースにして、１行にするとうまく行くと思います。

単純に書くと、
<div onclick="this.innerHTML='【クリック後の表示】'">【クリック前の表示】</div>
という事になりますね。




もう一回押したら元に戻す、というやり方を現在模索中ですが、

とりあえず「Ｆ５」キーを押せば戻るので、今回はこのくらいで。





さて、続きは別ページに書きましたので、

お手数ですが、

http://charlie432.fool.jp/20091220.htm

へお飛び下さればと思います。

理由は、WordPress が勝手に半角の「’」や「"」を全角の「’」「”」に変えてしまい、

表示がおかしくなってしまうからです。

結局その対処が出来ませんでした。。。｡ﾝ､ﾐ






　

最後までお読みくださり、有難うございました。