0

4秒ごとに切り替わる2つのバナー（画像）があります。一方の画像はクリック可能で、もう一方はクリックできません。以下はコードです、

<div class="contentdiv">
   <h:commandLink  action="#{mybean.firstImageClick}" id="firstBanner" style="text- decoration:none;">
       <img src="imagePath" width="590" height="210"  border="0" style="cursor: pointer;"/> 
</h:commandLink>
</div>


<div class="contentdiv">
    <img src="imagePath" width="590" height="210"  border="0" style="cursor: default;"/>
</div>

1枚目と2枚目の画像のスタイルをそれぞれとに指定pointerしdefaultました。

画像が切り替わると、ユーザーが画像の上にカーソルを移動すると、最初の画像がユーザーへのポインタとして表示されます。2番目の画像に切り替えが発生し、ユーザーがカーソルを画像から離していない場合、2番目の画像もデフォルトではなくポインタとして表示されます。ユーザーが2番目の画像をクリックした場合にのみ、デフォルトとして変更され、ユーザーは2番目の画像がクリックできないことを知るようになります。

1枚目の画像でも同じことが起こります。ユーザーが2番目の画像にいて、2番目の画像から1番目の画像に切り替わった場合でも、カーソルはポインターとして代わりにデフォルトになります。したがって、ユーザーは最初の画像がクリック可能であることを知りません。

4

2 に答える 2

0

ポインタイベントを試してください：なし; cssプロパティはあなたが望むところならどこでも言及します。

于 2012-12-14T05:57:05.493 に答える
0

インラインスタイルを使用する代わりに、次のようにカーソルスタイル用に2つの単純なクラスを作成するだけです。

CSSの場合：

<style type="text/css">
.clickable {
cursor:pointer;
}
.not_clickable{
cursor:default;
}
</style>

HTMLの場合：

<div class="contentdiv">
   <h:commandLink  action="#{mybean.firstImageClick}" id="firstBanner" style="text- decoration:none;">
       <img src="imagePath" width="590" height="210"  border="0" class="clickable"/> 
</h:commandLink>
</div>


<div class="contentdiv">
    <img src="imagePath" width="590" height="210"  border="0" class="not_clickable"/>
</div>

その後、画像をトリガーまたはクリックしながら、希望に応じてクラスを簡単に切り替えることができます。

于 2012-12-14T09:16:41.780 に答える