JavaScript-阻止按空格页面滚动

当页面有滚动条时，按空格键会滚动页面，这是浏览器的默认行为，去除该默认行为即可。

注意：给keydown事件绑定~

document.body.onkeydown = function (event) {
    var e = window.event || event;
    e.preventDefault();
}
时间： 2024-10-28 04:23:01

JavaScript-阻止按空格页面滚动的相关文章

现代 JavaScript 与 CSS 令人着迷滚动实现指南

一些(网站)滚动的效果是如此令人着迷但你却不知该如何实现,本文将为你揭开它们的神秘面纱.我们将基于最新的技术与规范为你介绍最新的 JavaScript 与 CSS 特性,(当你付诸实践时,)将使你的页面滚动更平滑.美观且性能更好. 大多数的网页的内容都无法在一屏内全部展现,因而(页面)滚动对于用户而言是必不可少的.对于前端工程师与 UX 设计师而言,跨浏览器提供良好的滚动体验,同时符合设计(要求),无疑是一个挑战.尽管 web 标准的发展速度远超从前,但代码的实现往往是落后的.下文将为你介绍一些

[转]JavaScript实现 页面滚动图片加载

本文转自:http://www.cnblogs.com/Darren_code/archive/2011/07/21/LoadImage.html 又到了这个月的博客时间了,原计划是打算在这个月做一个的功能较炫的拖拽类,可是感觉想的太容易,实现起来遇见不少问题,如果技术分享做不到有助于人反而害人,那就歇菜了,所以还是等本人多找些资料研究研究,“拖拽类“先放放吧,下面开始正题... 为什么写这篇文章? 1.优化页面很实用的方法,技术实现不难: 2.搜索了相关内容的文章,好像都是用jQuery的方法

JavaScript实现页面滚动到div区域div以动画方式出现

用JavaScript实现页面滚动到div区域div以动画方式出现CSS动画 页面滚动到一块区域,改区域以动画方式出现实现这个效果需要二点:一我们要先写好一个css动画,二:用js的监听页面滑动的距离在给div添加动画 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style> img { width: 1

Javascript实现页面滚动时导航智能定位

遇到的问题: 在做官网的时候,需要滚动定位的区块的图片不确定,无法确定用户浏览区域对应的模块导航 之前的解决方案是: 通过定位滚动条的位置来判断用户浏览区域对应的模块导航,这种方法的弊端是,区块的高度不确定时就无法计算滚动条的位置来判断: 优化方案: 页面中会有多个模块,每个模块对应一个导航,当页面滚动到某个模块时,对应的模块导航需要加上一个类用于区分当前用户所浏览区域. 以下是DEMO <!-- html --><div class="container">

Javascript页面滚动时导航智能定位

常见的开发页面中可能会有这么一个需求,页面中会有多个模块,每个模块对应一个导航,当页面滚动到某个模块时,对应的模块导航需要加上一个类用于区分当前用户所浏览区域. 假设结构如下: <div class="container"> <div class="wrapper"> <div class="section" id="section1">section1</div> <di

移动页面滚动穿透解决方案（荐）

移动页面滚动穿透解决方法目前有多种解决方案,我介绍下几种方案: 解决方案1:阻止冒泡. //关键代码 $(".sliders,.modals").on("touchmove",function(event){ event.preventDefault(); }); 全部代码附上: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <m

页面滚动性能优化之passive

passive有何用? 正如标题所言,passive就是为了让浏览器的页面滚动起来更加丝滑,飞一般的感觉~ ? passive怎么用 看完还是不懂,不着急,看下述慢慢道来 ? passive的前世今生 对于addEventListener(),大家都是认识的,为dom添加触发事件,那么,今天的故事就从这里开始. 在早期addEventListener是这样的: addEventListener(type, listener, useCapture) 其中useCapture:是否允许事件捕捉,但

jquery页面滚动显示浮动菜单栏锚点定位效果

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <title>jQuery

js页面滚动时层智能浮动定位实现:

案例展示: 第一个:每个人都有看过的淘宝页面: 案例就不多说了,有兴趣的可以多去找找, 这样的智能浮动效果还是不错的,挺方便. 基本的实现原理: 首先有一个默认状态就是没有滚动的时候,什么事情也不用做,定位可以是absolute,也可以是stati,fixed,relartive 这些都可以.我们主要需要关注的是当浏览器滚动的时候,(要浮动的块)要移除浏览器界面视区的时候,修改其position属性,让其浮动在窗口的上沿显示就可以了.最好的position属性就是fixed了,可以在IE6+和其