jquery动态创建元素 div元素随垂直滚动条位置变化置顶显示
刚打开页面效果
拖动滑动条之后效果
页面代码
<!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>
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("<div>").html("动态创建的div").appendTo($("#div1"));
$("<div/>").html("动态创建的divrrrrrr").appendTo($("#div1")); jQuery(window).bind('scroll resize', function () {
var scrollTop = jQuery(window).scrollTop();
//
if (scrollTop >= 100) {
//alert(scrollTop);
$(" .box").addClass('b_fly_fixtop');
}
else {
// alert('888');
$(" .box").removeClass('b_fly_fixtop'); }
});
});
</script> <style type="text/css">
.contain
{
width:100%;
height:50px;
display:inline-block;
}
.box
{
height:50px;
width:100%;
background-color:Gray;
}
.b_fly_fixtop
{
position: fixed;
top: 0;
left: 0;
width: 100%;
border-top: 0;
z-index: 900;
} </style>
</head>
<body>
<div id="div1"></div>
<div class="">88888</div>
<div style=" height:100px; width:100%"></div>
<div class="contain " id="divtestyyy">
<div class="box "> xians</div>
</div>
<div style=" height:300px; width:100%"></div>
<div style=" height:100px; width:100%">yyyyy</div>
<div id="div1">10</div>
<div id="div2">20</div>
<div id="div3">30</div>
<a href="www.baidu.com">百度</a>
<a href="www.sina.com">新浪</a>
<a href="www.qq.com">腾讯</a>
<a href="www.taobao.com">阿狸</a>
<div id="idouthtml">
<div>888889999</div>
</div>
</body>
</html>
jquery动态创建元素 div元素随垂直滚动条位置变化置顶显示的更多相关文章
- jquery动态创建页面元素
jquery用$()方法动态创建一个页面元素,例如: var $div=$("<div title='动态创建页面元素'>欢迎创建一个新的div</div>" ...
- js进阶---12-11、jquery如何给动态创建出来的元素绑定事件
js进阶---12-11.jquery如何给动态创建出来的元素绑定事件 一.总结 一句话总结:通过事件委托的方式,通过on方法 1.on方法在事件绑定的时候,data方式带额外参数时,字符串参数和其它 ...
- jQuery动态创建html元素的常用方法汇总
在使用jQuery进行WEB程序设计的时候非常有用.分享给大家供大家参考.具体方法如下: 一般来说,可以通过以下几种方式动态创建html元素: 1.使用jQuery创建元素的语法 2.把动态内容存放到 ...
- JavaScript 、jQuery动态创建元素的关键字~
JavaScript动态创建元素: 1.创建元素 如:a 标签 var alink= document.createElement("a"); 2.j添加元素属性 alink.h ...
- 解决jquery动态创建元素绑定事件失效问题
存在问题 在我们使用jquery动态创建元素后往往会遇到一些问题,如: 给.button按钮绑定了点击时间,执行alert:(1); 点击事件代码如下: <script>$("# ...
- 第84天：jQuery动态创建表格
jQuery动态创建表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- 基于jQuery动态创建html元素
在做web前端开发的时候,经常遇到一些数据多少或则类型不能在运行之前就确定下来的情况,此时,数据的展示,就要借助于动态创建html元素来展示了. 常见的动态创建HTML元素的方式,有如下几种,大体都差 ...
- jquery 动态创建的元素，绑定事件无效之解决方法
今天遇到一个问题,动态创建的元素,绑定事件无效,如下: js 代码如下: var OaddX = $('.detright div.duibi div.duibox ul li span'); // ...
- JQuery 动态加载 HTML 元素时绑定点击事件无效问题
问题描述 假设项目中有一个列表页面,如下: 当点击列表一行数据可以显示详情页面,而详情页面的数据是根据当前行的数据作为参数,通过 ajax 请求到后台返回的数据,再根据返回的结果动态生成 html 页 ...
随机推荐
- Rundeck概况
1.Rundeck介绍 RunDeck是用Java/Grails写的开源工具,帮助用户在数据中心或者云环境中自动化各种操作和流程.通过命令行或者web界面,用户可以对任意数量的服务器进行操作,大大降低 ...
- Dom与Bom，增删改查
对Web标准的理解:web标准是由一系列标准组合而成的,页面有三个部分组成:结构,表现和行为.因而web标准即由结构化标准语言主要有 xml和xhtml,表现标准语言css,行为标准主要包括对象模型( ...
- LeetCode 902. Numbers At Most N Given Digit Set
应该是常数 N的位数时间级别 我的这个方法超时很严重...但是特此记录 费劲巴拉写的... 超时: int atMostNGivenDigitSet(char** D, int DSize, int ...
- git服务器-------》用户免密git操作
找到/etc/ssh/sshd_config文件 开启 RSAAuthentication yesPubkeyAuthentication yesAuthorizedKeysFile .ss ...
- WebAPI请求——js调用
继续接着上文 ASP.NET MVC学习系列(一)-WebAPI初探 来看看对于一般前台页面发起的get和post请求,我们在Web API中要如何来处理. 这里我使用jQuery 来发起异步请求实现 ...
- Codeforces679E. Bear and Bad Powers of 42
传送门 今天子帧的一套模拟题的T3. 考试的时候其实已经想到了正解了,但是一些地方没有想清楚,就没敢写,只打了个暴力. 首先考虑用线段树维护区间信息. 先把每个值拆成两个信息,一是距离他最近的且大于他 ...
- 20145328 《Java程序设计》第9周学习总结
20145328 <Java程序设计>第9周学习总结 教材学习内容总结 第十六章 整合数据库 16.1JDBC 16.1.1JDBC简介 JDBC(Java DataBase Connec ...
- word里怎么删除某一列
光标定位在第二列第一个字的前面,然后按住Alt键,拖动鼠标,选中第二列字,松开Alt键,点击Delete键即可
- iOS日常学习 - 如何配置.gitignore文件
文章为转载学习,原文地址 为什么要配置.gitigore 在我们使用git的过程当中,不是任何文件都需要commit到本地或者远程仓库的,比如一些三方库文件. 那么作为一个git新手,很多人不知道如何 ...
- vue.js的一些小语法v-bind,v-if,v-show,v-else
知识点: v-bind 动态绑定标签属性 v-bind 可简写为 : 使用v-bind 绑定class和内联样式 使用v-if,v-show,v-else进行条件渲染 <template> ...