jquery弹窗时禁止body滚动条滚动的例子
当弹出一个jq提示窗口的时候,一般窗口右边还会有进度条的情况,禁止进度条方法
禁止浏览器滚动条滚动:
$('body').css({ "overflow-x":"hidden", "overflow-y":"hidden" });
关闭弹出的窗口的时候需要显示出来,让浏览器窗口可以继续滚动
还原滚动:
$('body').css({ "overflow-x":"auto", "overflow-y":"auto" });
以上这篇jquery弹窗时禁止body滚动条滚动的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
jquery简单实现纵向的无缝滚动代码实例
简单实现纵向无缝滚动(不要忘记引入jquery文件哦) 看效果: 1.HTML代码 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>简单的jQuery无缝向上滚动效果</title> </head> <body> <div class="myscroll&qu
-
jQuery实现的简单歌词滚动功能示例
本文实例讲述了jQuery实现的简单歌词滚动功能.分享给大家供大家参考,具体如下: jquery实现歌词滚动 1.css /* CSS Document */ * { margin: 0; padding: 0; font-size: 12px; } body { background: none; } input, button, select, textarea { outline: none; } ul, li, dl, ol { list-style: none; } a { colo
-
JQuery获取元素尺寸、位置及页面滚动事件应用示例
本文实例讲述了JQuery获取元素尺寸.位置及页面滚动事件应用.分享给大家供大家参考,具体如下: 获取元素尺寸 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="http://libs.baidu.com/jquery/2.0.0/jqu
-
Jquery实现无缝向上循环滚动列表的特效
效果呈现 整个列表间隔设定的时间向上移动一个item的高度 html结构: <div class="slide-title"> <span>title1</span> <span>title2</span> <span>title3</span> </div> <div class="slide-container"><!--css设置时,注意高度是显示
-
jQuery实现当拉动滚动条到底部加载数据的方法分析
本文实例讲述了jQuery实现当拉动滚动条到底部加载数据的方法.分享给大家供大家参考,具体如下: 滚动条到底部加载数据原理很简单,就是为window或者滚动元素添加一个scroll事件,浏览器每次触发scroll事件时判断是否滚动到了浏览器底部, 如果到了底部则加载新数据.关键是计算滚动条是否滚动到了浏览器底部,算法如下 滚动条卷起来的高度 + 窗口高度 > 文档的总高度 $(window).on('scroll',function(){ if(scrollTop() + windowHeig
-
JavaScript实现的滚动公告特效【基于jQuery】
本文实例讲述了JavaScript实现的滚动公告.分享给大家供大家参考,具体如下: 今天给大家分享一篇滚动公告的特效. 效果图: 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>滚动公告</title> <script src="http://libs.baidu.com/jque
-
Easyui 去除jquery-easui tab页div自带滚动条的方法
测试环境 jquery-easyui-1.5.3 需求场景 打开tab页面时,自动载入一个iframe页面,除了iframe页面本身会出现一个滚动条,tab标签页也出现一个滚动条,如下图所示,需求就是去掉tab页面的滚动条 解决方法 通过观察html页面结构,发现这个滚动条归属class为pannel-body的div 所以,解决方案,只需要添加样式即可.如下,带背景色内容: <head> -- <style type="text/css"> /*去掉easyu
-
jQuery实现判断滚动条滚动到document底部的方法分析
本文实例讲述了jQuery实现判断滚动条滚动到document底部的方法.分享给大家供大家参考,具体如下: 滚动条没有实际的高度.只是为了呈现效果才在外型上面有长度. 在js当中也没有提供滚动条的高度API. 参考了网上有关资料:判断滚动条到底部的基本逻辑是滚动条滚动的高度加上视口的高度,正好是document的高度,公式表示为 滚动条滚动的高度+浏览器视口的高度>=document的高度. 参考网上资料,具体代码如下: //滚动条在Y轴上的滚动距离 function getScrollTop(
-
利用jquery和BootStrap实现动态滚动条效果
在某项目中遇到excel导入时客户要求显示滚动条效果,在此基础上使用js为其封装了个进度条类,只需要简单为其创建个div容器就可轻松实现效果,类具体如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=
-
jquery弹窗时禁止body滚动条滚动的例子
当弹出一个jq提示窗口的时候,一般窗口右边还会有进度条的情况,禁止进度条方法 禁止浏览器滚动条滚动: $('body').css({ "overflow-x":"hidden", "overflow-y":"hidden" }); 关闭弹出的窗口的时候需要显示出来,让浏览器窗口可以继续滚动 还原滚动: $('body').css({ "overflow-x":"auto", "
-
小程序显示弹窗时禁止下层的内容滚动实现方法
小程序显示弹窗时禁止下层的内容滚动实现方法,具体如下 ① 第一种方式 利用position:fixed. 禁止页面滚动. 一. 页面结构html <view class="indexPage {{proInfoWindow?'indexFixed':''}}"> -----------此处为整个页面的结构内容 <button catchTap="_proInfoWindowShow">点击显示弹窗</button> <
-
jQuery实现将div中滚动条滚动到指定位置的方法
本文实例讲述了jQuery实现将div中滚动条滚动到指定位置的方法.分享给大家供大家参考,具体如下: 一.Js代码: onload = function () { //初始化 scrollToLocation(); }; function scrollToLocation() { var mainContainer = $('#thisMainPanel'), scrollToContainer = mainContainer.find('.son-panel:last');//滚动到<div
-
jQuery控制div实现随滚动条滚动效果
本文实例讲述了jQuery控制div实现随滚动条滚动效果的方法.分享给大家供大家参考,具体如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jquery div随滚动条滚动效果</title> <script src="../js/jquery-1.11.1.min.js" type="text/javascript"&
-
jquery 点击元素后,滚动条滚动至该元素位置的方法
点击元素后,滚动条滚动至该元素位置: $('a.lead-link').bind('click', function(e) { e.preventDefault(); $('html,body').animate({ scrollTop: $(this.hash).offset().top - 60 }, 1500); }); 以上这篇jquery 点击元素后,滚动条滚动至该元素位置的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
jQuery实现浮动层随浏览器滚动条滚动的方法
本文实例讲述了jQuery实现浮动层随浏览器滚动条滚动的方法.分享给大家供大家参考.具体如下: 这是jQuery实现的一个浮动层效果,随浏览器滚动条而滚动,并一直保持在顶部位置,请使用火狐测试,IE下表现不尽理想. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-float-follow-nav-style-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
-
利用jquery禁止外层滚动条的滚动
前言 通常情况下,当内部滚动条滚动到两端时,再接着滚动时外层的滚动条就会跟着滚动:可是有时我们希望用户只能滚动当前区域,而不触发外层(window)的滚动条,离开当前区域后,才能滚动外层的滚动条.因为用户可能一不小心滚动的幅度过大了,导致当前区域离开可视区域. 在jquery中,滚动事件是scroll,而这个事件是不能阻止冒泡和阻止默认事件的.假如我们设定要禁止window的滚动条,我采取的策略是:当鼠标进入到当前区域后,则window的滚动条的高度始终是鼠标进入前的高度 如下的代码: <sty
-
jQuery 锚点跳转滚动条平滑滚动一句话代码
jQuery锚点跳转滚动条平滑滚动一句话代码 复制代码 代码如下: $("html,body").animate({scrollTop: $("#box").offset().top}, 1000); 一下是一些jquery的小技巧1. 控制编译结果 复制代码 代码如下: <script type="text/javascript" src="scripts/jquery-1.2.6.min.js"></sc
-
jQuery结合AJAX之在页面滚动时从服务器加载数据
简介 文本将演示怎么在滚动滚动条时从服务器端下载数据.用AJAX技术从服务器端加载数据有助于改善任何web应用的性能表现,因为在打开页面时,只有一屏的数据从服务器端加载了,需要更多的数据时,可以随着用户滚动滚动条再从服务器端加载. 背景 是Facebook促使我写出了在滚动条滚动时再从服务器加载数据的代码.浏览facebook时,我很惊讶的发现当我滚动页面时,新的来自服务器的数据开始插入到此现存的数据中.然后,对于用c#实现同样的功能,我在互联网上了查找了相关信息,但没有发现任何关于用c#实现
-
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. 复制代码 代码如下: var container = $('div'), scrollTo = $('#row_8'); container.scrollTop( scrollTo.offset().top - container.offset().top + container.scrollTop() ); // Or you can animate the scrolling: container.animate({
随机推荐
- 基于Java回顾之JDBC的使用详解
- php调用云片网接口发送短信的实现方法
- Riot.js 快速的JavaScript单元测试框架
- BootStrap Table复选框默认选中功能的实现代码(从数据库获取到对应的状态进行判断是否为选中状态)
- 兼容iOS 10 升级xcode8出现的问题及一些适配问题的解决方案
- iOS开发项目- 基于WebSocket的聊天通讯(2)
- Mozilla中显示textarea中选择的文字
- 使用PHP Socket 编程模拟Http post和get请求
- [PHP] 《PHP边学边教》(01.开篇——准备工作)
- android根据分辨率自动调整字体大小的实例代码
- linux 安装过程全攻略
- 详解js界面跳转与值传递
- SQL Server提示"选定的用户拥有对象,所以无法除去该用户”
- android开发之listView组件用法实例简析
- java构造函数示例(构造方法)
- PHP中其实也可以用方法链
- 超个性的导航效果
- Android判断某个权限是否开启的方法
- js操作二进制数据方法
- 微信小程序实现限制用户转发功能的实例代码