自分のバナー紹介タグをアイフレに入れたい | リアナのカスタマイズ日記(CSS編集用デザイン)

リアナのカスタマイズ日記(CSS編集用デザイン)

アメブロ 新CSS CSS編集用デザイン 無料
カスタマイズ アメブロカスタマイズ 初心者
CSS スタイルシート デザイン
javascript jQuery


Q 自分のバナー紹介タグをアイフレに入れたい


答え 下記の様に行います。


● クリック時に範囲選択のケース

① フリースペースのアイフレの部分のバナー紹介ブログを入れたい場所に下記を入れる


<div id="bannerx1"></div>



② フリープラグインに下記を追記します。


<div id="bannerx1w">
<center><img src="バナー画像のURL"><br><input value='<a href="http://ameblo.jp/アメーバID/" target="_blank"><img src="バナー画像のURL"></a>' readonly onclick="this.select()" style="background-color:#FFB6C1;color:#FF69B4;width:160px;border:1px solid #cccccc;"></center>
</div>
<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type="text/javascript">
$(document).ready(function(){$("#bannerx1w").appendTo("#bannerx1");})
</script>


◆ style部分の色は調整してしてください。枠線(border)も調整してください。
◆ アメーバIDは自分のアメーバIDに変えてください。
◆ バナー画像のURLは変えてください。
◆ 下記はフリープラグインの先頭に1つあればOKです。

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>





● カーソルを乗せたときに範囲選択のケース

① フリースペースのアイフレの部分のバナー紹介ブログを入れたい場所に下記を入れる


<div id="bannerx1"></div>




② フリープラグインに下記を追記します。

<div id="bannerx1w">
<center><img src="バナー画像のURL"><br><input value='<a href="http://ameblo.jp/アメーバID/" target="_blank"><img src="バナー画像のURL"></a>' readonly onmouseover="this.select()" style="background-color:#FFB6C1;color:#FF69B4;width:160px;border:1px solid #cccccc;"></center>
</div>
<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type="text/javascript">
$(document).ready(function(){$("#bannerx1w").appendTo("#bannerx1");})
</script>




◆ style部分の色は調整してしてください。枠線(border)も調整してください。
◆ アメーバIDは自分のアメーバIDに変えてください。
◆ バナー画像のURLは変えてください。
◆ 下記はフリープラグインの先頭に1つあればOKです。

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>



● 実例は、下記を参照

自分のバナーのタグを紹介するのには、どうしたらいいの?