js实现点击网页空白处跳转网址效果

发布时间：2018-10-29 14:30:53 所属栏目：交互来源：站长网

导读：最近一段时间，谷歌可谓是折腾了又折腾，就拿昨天的跳转事件来说吧，可把媒体忙活的不清，先是执行了跳转，然后又爆出不再跳转，申请牌照，尔后的时间又出现了奇迹：传谷歌中国获得ICP牌照续期，Google.CN重新回到中国，不再跳转香港了，烈火也忙了半天，

　　最近一段时间，谷歌可谓是折腾了又折腾，就拿昨天的跳转事件来说吧，可把媒体忙活的不清，先是执行了跳转，然后又爆出不再跳转，申请牌照，尔后的时间又出现了“奇迹”：传谷歌中国获得ICP牌照续期，Google.CN重新回到中国，不再跳转香港了，烈火也忙了半天，不过也在谷歌的简单跳转总结了一个JS跳转的效果，送给大家，希望朋友能够喜欢。

　　不说费话，效果：点击网页空白处、点击图片都跳转网址。如下：

　　网页版：猛击这里

　　运行版：

<!DOCTYPE html> <html lang="zh"> <meta charset="gbk"> <title>仿Google点击跳转效果 - Liehuo.Net</title> <style> html { background: #fff; margin: 0 1em; } body { font: .8125em/1.5 arial, sans-serif; text-align: center; } h1 { font-size: 1.5em; font-weight: normal; margin: 1em 0 0; } p#footer { color: #767676; font-size: .77em; } div { -moz-border-radius: 20px; -webkit-border-radius: 20px; border: 1px solid #ccc; border-radius: 20px; margin: 2em auto 1em; max-width: 650px; min-width: 544px; } div:hover, div:hover * { cursor: pointer; } div:hover { border-color: #999; } div p { margin: .5em 0 1.5em; } img { border: 0; } </style> <div> <a href="http://www.veryhuo.com/?demo_gg_jump"><img src="http://www.veryhuo.com/images/logo.gif" alt="Google"></a> <h1>仿谷歌点击跳转，无论点击网页空白或图片，都将跳转，不点击不跳转！</h1> <p>请收藏我们的网址 www.veryhuo.com </div> <p id="footer">© 2010 liehuo.net <script> var gcn=gcn||{};gcn.listen=function(a,e,b){if(a.addEventListener){a.addEventListener(e,b,false)}else if(a.attachEvent){a.attachEvent('on'+e,b)}};gcn.redirect=function(){window.location='http://www.veryhuo.com/?demo_gg_jump'}; gcn.listen(document, 'click', gcn.redirect); </script> <br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

（编辑：源码网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

物联网的七大技术走向	智慧城市中5G和物联网
让智能建筑成为可能的	中国移动研究院副院长