0

リンク画像を作ってみました。

すべてがリンクで機能しますが、ホバー時に表示する2番目の画像を追加すると、その周りに奇妙な境界線が表示されます。国境を避ける方法はありますか？ここに写真を追加することはできないので、ここを見てください：

http://postimg.org/image/7q0jkc99t/

htmlで：

<div id="Oobj14">
<a href="formularz.html"><img id="Ggeo9" class="przed" onmouseover="this.className='po'" 

onmouseout="this.className='przed'" alt=""></div>

CSSで：

.przed{
background: url('image/dolacz.png') no-repeat;
width: 249px;
height: 70px;
border-style: none;
}

.po{
background: url('image/dolacz2.png') no-repeat;
width: 249px;
height: 70px;
border-style: none;
}

画像の場合：

#Oobj14 {
  position: absolute;
  font-size: 10px;
  z-index: 13;
  left: 43.20em;
  top: 40.70em;
  width: 143px;
  height: 56px;
  border-style: none;
}

img#Ggeo9 {
  width: 100%;
  height: 100%;
  opacity:1.0;
4

1 に答える 1

0

なぜJavaScriptを使用するのですか? 画像を捨てて、単に背景を使用します。CSS :hover を使用して別の背景に切り替えます

HTML:

<div id="Oobj14">
<a href="formularz.html">Descriptive text</a>
</div>

CSS:

#Oobj14 a {
  position: absolute;
  font-size: 10px;
  z-index: 13;
  left: 43.20em;
  top: 40.70em;
  width: 143px;
  height: 56px;
  border-style: none;
  overflow:hidden;
  text-indent:-2000px;
}

#Oobj14 a {
  background: url('image/dolacz.png') no-repeat;
  width: 249px;
  height: 70px;
  border-style: none;
}

#Oobj14 a:hover {
  background: url('image/dolacz2.png') no-repeat;
}
于 2013-11-08T22:24:45.007 に答える