DaffodilGirl 2013-04-10 02:28 采纳率: 0%
浏览 2275
已采纳

iphone-CSS中悬停的问题

使用下面的CSS创建了一个button,在鼠标悬停的时候会改变,但是鼠标离开之后,应该恢复正常状态,要怎么实现?

.button {
height:40px;
width:95px;
margin-top:10px;
float:left;
overflow:hidden;
margin-left:14px;
background-image: -webkit-linear-gradient(bottom, #558544 0%, #5EA83D 100%);
border-radius: 12px;
border-style:solid;
border-color:#558544;
border-width:5px; }

.button:hover {
    background-image: -webkit-linear-gradient(bottom, #5EA83D 0%, #558544 100%);
}
  • 写回答

1条回答

  • redCoral_ 2013-04-10 07:29
    关注

    CSS中的悬停不是那么运行的,你需要使用指定的javascript(ontouchstart 和ontouchend),给按钮添加一些类来处理"down"动作。

    举个栗子:
    HTML

    <div class="button" ontouchstart="buttonTouchStart(event)" ontouchend="buttonTouchEnd(event)" ></div>
    

    javascript

    var buttonTouchStart = function(e) {
        var t = e.target;
        t.className = "button down";
    }
    var buttonTouchEnd = function(e) {
        var t = e.target;
        t.className = "button";
    }
    

    可能还需要使用媒体查询禁用一些针对javascript 悬停CSS设备。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题