首页 > 代码库 > 知乎首页延时交互的小思路
知乎首页延时交互的小思路
感觉这种交互,比把鼠标放到头像上右侧内容马上就改变要好。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script><style type="text/css">body{ margin:50px; }.touxiang{ border:1px solid #E5D1A1; text-align:center; width:150px; height:150px; background:#FFFDD2; float:left; }.neirong{ width:300px;height:500px; margin-left:30px;border:1px solid #E5D1A1;background:#fff;float:left; }</style></head> <body> <div class="touxiang">这里是头像</div> <div class="neirong">这里是内容区域</div> </body><script type="text/javascript">function changetext(){ $(".neirong").text(‘hahaha‘);}$(function(){$(".touxiang").hover(function(){ timeout_name = setTimeout("changetext()",1500); },function(){ clearTimeout(timeout_name) ; }) })</script></html>
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。