制作不随浏览器滚动的DIV-带关闭按钮
2024-08-27 14:32:24
制作不随浏览器滚动的DIV
效果见 http://bbs.csdn.net/topics/90292438 的滚动效果。
$(function(){
//获取要定位元素距离浏览器顶部的距离
var navH = $(".detail_title_fixed").offset().top;
$(".detail_title_fixed").hide(); var show_detail_title_fixed = true;
//滚动条事件
$(window).scroll(function(){ //获取滚动条的滑动距离
var scroH = $(this).scrollTop(); //滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定,反之就不固定
if(show_detail_title_fixed){
if(scroH>=navH){
$(".detail_title_fixed").css({"position":"fixed","top":"0","border":"1px #198cc5 solid","z-index":"99999"});
$(".detail_title_fixed").show();
}else if(scroH<navH){
$(".detail_title_fixed").css({"position":"static"});
$(".detail_title_fixed").hide();
}
}
}); $("#close_detail_title_fixed").click(function(){
show_detail_title_fixed = false;
$(".detail_title_fixed").hide();
}); })
最新文章
- linux tomcat 启动
- windows下调用外部exe程序 SHELLEXECUTEINFO
- Effective Java 51 Beware the performance of string concatenation
- WPF 元素绑定
- PHP CI框架email类发送邮件
- 2013 ACM 通化邀请赛 A. Tutor
- [android]fmodex在某些android设备上声音延迟Latency
- Spring 3.0 + Atomikos构建jta分布式事务
- switch case实现两个数的算术运算
- bzoj1004:[HNOI2008]Cards
- MFC中全局变量的定义及使用
- Apple Watch 2.0 数据通讯
- java正则表达式验证汉字
- JSON 在Ajax数据交换中的简单运用
- 如何解决PeopleSoft Process Scheduler发布问题
- C# 利用反射动态加载dll
- Enterprise Architect
- Maven和Solr简单总结
- HDU3081(KB11-N 二分答案+最大流)
- VMware 15 安装 MAC OS 10.13 原版(详细图文教程)
热门文章
- 【卡常 bitset 分块】loj#6499. 「雅礼集训 2018 Day2」颜色
- 【交互 细节题 思维题】cf1064E. Dwarves, Hats and Extrasensory Abilities
- mybatis枚举类型处理器
- paper:synthesizable finit state machine design techniques using the new systemverilog 3.0 enhancements之fsm1各种style的timing/area比较
- MySQL如何复制一个表
- Form和ModelForm组件
- Java并发编程的艺术 记录(三)
- Linux学习-检验软件正确性
- 排序 sort函数
- js各种继承方式和优缺点的介绍