ママのスキンケアのお悩みにおすすめアイテム

分かりにくくて申し訳ありません.

現在ホームページを作成しております.
背景を透明にした画像を(ページA)でリンクのボタンとして使ったところ、移動先の(ページB)から「戻る」ボタンで(ページA)に戻ってくると、透明部分を取り囲むように点線の枠が表示されてしまい、非常に見た目が悪いです.

「戻」ってきたときに、この点線の枠を表示させない方法はありますでしょうか.

自分としては、(ページA)に飛ぶたびに、新しく読み込み直すようなjavascriptでもあればいいなと思って探しましたが、引っ掛けることができませんでした.

すみませんが、宜しくお願いします.

「自作ホームページ内のリンクで「戻る」ボタ」の質問画像

このQ&Aに関連する最新のQ&A

A 回答 (4件)

確認に使ったソースです。


■goo1.html という名前で保存してください
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>リンク1</title>
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
<!--
.norborder a {
overflow:hidden;
outline:none;
}
img {
border:none;
}
-->
</style>
</head>
<body>
<h1>ページ1</h1>
<p class="norborder"><a href="goo2.html"><img src="http://cmm001.goo.ne.jp/img/sn/sn_50.gif"></a></p>
<p><a href="goo2.html"><img src="http://cmm001.goo.ne.jp/img/sn/sn_50.gif"></a></p>
</body>
</html>


■以下goo2.html という名前で保存してください
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>リンク2</title>
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
<!--
.norborder a {
overflow:hidden;
outline:none;
}
img {
border:none;
}
-->
</style>
</head>
<body>
<h1>ページ2</h1>
<p class="norborder"><a href="goo1.html"><img src="http://cmm001.goo.ne.jp/img/sn/sn_50.gif"></a></p>
<p><a href="goo1.html"><img src="http://cmm001.goo.ne.jp/img/sn/sn_50.gif"></a></p>
</body>
</html>

上のリンクはラインが消えてて、下のリンクはラインがでてませんか?

この回答への補足

お手数おかけして済みません。
確認はIE7で行っています。

教えて頂いたものをコピーペーストして確かめてみましたが、上と下どちらのリンクも、リンク先に飛んでから「戻る」ボタンで戻ってくると、点線の枠が表示されてしまいます。

何か間違った操作をしているんですかね…。コピペしかしていないつもりなのですが…。

補足日時:2009/06/04 19:55
    • good
    • 0
この回答へのお礼

申し訳ありません。
そもそも自分で問題点をきちんと理解できていなかったようです。説明もあまりよくありませんでした、すいません。

問題の本質がやっと分かりましたので、質問を変えることにしました。
なので、この質問は締めさせて頂きます。

ありがとうございました。

お礼日時:2009/06/05 13:56

おかしいなぁ


IE7,8,firefoxで確認してますが出来ますよ、記述間違えてませんか?
スクリーンショットがIE7~ぽいですけど、実際は何で確認してますか?

>現在ホームページを作成しております
と書いてあるのでAとBのページは自分で作ったhtmlですよね?
    • good
    • 0

cssは使ってないのかな?


とりあえずhtmlの<head>と</head>の間に下のソースをコピペしてみてください

<style type="text/css">
<!--
a{
overflow:hidden;
outline:none;
}
-->
</style>

この回答への補足

ありがとうございます。

コピペをしてみましたが、やはり周囲の点線が表示されてしまいました。

ネットでいろいろなページを見てみましたが、表示されないページは見つかりませんでした…、無理ということでしょうか;_;

補足日時:2009/06/04 12:32
    • good
    • 0

a{


overflow:hidden;
outline:none;
}
確かこんな感じだったような、
アクセサビリティの関係で使わないから自信ないです

この回答への補足

早速の対応ありがとうございます!

すみません、どこに書き込めば良いかも分からず…
実際には次のような記述になっているのですが、実例をお願いしてもよろしいでしょうか?(1つの透明画像に、ハイパーリンクと二つのjavascriptを適応しようとしてこんな記載になっております…、もう少しスマートな書き方があればいいのですが…)

1.pngという透明ボタンに対する<body>内の記載です。
--------------------------------------------
<a href="index.html" onMouseOver="PPinner(0)" onMouseOut="PCouter(0)">
<img border="0" src="images/button/1.png" onmousedown="onmousedown_image()" onmouseup="onmouseup_image()" onmouseover="onmouseover_image()" onmouseout="onmouseout_image()" id="onmouseimage"/>
</a>
--------------------------------------------

補足日時:2009/06/03 18:12
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング