空のリンクを貼る２つの方法

HTMLでリンクをクリックしてもページを移動しないようにする方法です。

１．模擬リンク

２．模擬リンク

上がリンク風のニセモノ、フェイクです。下が空のURLを使ったリンクです。クリックしても移動はしません。

ではやり方を見ていきましょう。

Sponsored Link

styleでリンク風に装飾する

style要素やCSSで、色などの見た目を自分のサイトのリンクと同じように加工します。そしてcursor: pointer;を追記し、マウスオーバーしたときのカーソルの形に指示を与えます。

サンプル

<span style="color: #0000ff; cursor: pointer; text-decoration: underline;">こうなります</span>

こうなります

URLに#!を追記する

そのページのURLに#!を追記します。

サンプル

<a href="http://omoidasecom.blogspot.jp/2011/11/blog-post_14.html#!">こうなります</a>

こうなります

	Sponsored Link