cursor:指针,默认不立即反映 [英] cursor:pointer and default not reflecting immediately
问题描述
我有两个横幅(图片),每4秒切换一次。一个图像是可点击的,另一个是不可点击的。下面是代码,
< div class =contentdiv>
< h:commandLink action =#{mybean.firstImageClick}id =firstBannerstyle =text- decoration:none;>
< img src =imagePathwidth =590height =210border =0style =cursor:pointer;/>
< / h:commandLink>
< / div>
< div class =contentdiv>
< img src =imagePathwidth =590height =210border =0style =cursor:default;/>
< / div>
我已将第一和第二个图像的样式指定为指针
和默认
。
当图像切换时,当用户将光标移动到图像上时,第一个图像将作为指针显示。当第二个图像发生切换时,当用户没有将光标移动离开图像时,第二个图像也将显示为指针,而不是默认值。
仅当用户点击第二张图片时,它将更改为默认值,然后用户将会知道第二张图片不可点击。
第一张图片也会发生同样的情况。当用户处于第二个图像中,并且当切换从第二个图像到第一个图像时,光标仍然是默认而不是指针。
而不是使用内联样式,只需创建两个简单的类
> < style type =text / css>
.clickable {
cursor:pointer;
}
.not_clickable {
cursor:default;
}
< / style>
对于HTML:
< div class =contentdiv>
< h:commandLink action =#{mybean.firstImageClick}id =firstBannerstyle =text- decoration:none;>
< img src =imagePathwidth =590height =210border =0class =clickable/>
< / h:commandLink>
< / div>
< div class =contentdiv>
< img src =imagePathwidth =590height =210border =0class =not_clickable/>
< / div>
之后,您可以根据自己的意愿轻松切换课程,而触发或点击图片。
I have two banners (images) which keep switching every 4 seconds. One image is clickable and the other is not. Below is the code,
<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>
I have specified style for 1st and 2nd image as pointer
and default
respectively.
When images switch, 1st image will appear as Pointer to user when he moves his cursor over the image. When a switch happens to 2nd image, and when user has not moved his cursor away from the image, 2nd image will also appear as Pointer instead of Default. Only when User clicks on 2nd image, it will change as Default and then User will come to know that 2nd image is not clickable.
Same thing happens with 1st image. When User is in 2nd image and when a Switch happens from 2nd image to 1st image, Cursor will still be default instead as Pointer. So, User doesn't know that 1st image is clickable.
Instead of using inline style.,just create two simple classes for your cursor styles like as follows.
For CSS :
<style type="text/css">
.clickable {
cursor:pointer;
}
.not_clickable{
cursor:default;
}
</style>
For 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>
After that you can easily switch over the classes as per your wish, while you triggering or clicking the image.
这篇关于cursor:指针,默认不立即反映的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!