vegetable-WEN
vegetable-WEN

前端小案例之仿淘宝固定侧边栏

简单仿淘宝固定侧边栏案例-通过添加页面滚动事件实现相应效果

最近入门学习前端用简单的html结构加CSS样式还有js写了个仿淘宝固定侧边栏案例的小案例在这里分享给大家。

文章目录

    • 简单仿淘宝固定侧边栏案例-通过添加页面滚动事件实现相应效果
  • 一、案例介绍？
  • 二、案例代码
  • 总结

提示：以下是本篇文章正文内容，下面案例可供参考

一、案例介绍？

效果如下:
前端小案例之仿淘宝固定侧边栏_第1张图片

该案例有四个盒子，slider-bar、header、main、footer将slider-bar侧边栏盒子先用绝对定位定位到右侧，其他三个盒子依次居中对齐放。可以看到当我们滚动到主体页面的时候我们的侧边栏盒子变成固定定位并维持在那个位置，当我们滚动到尾部区域的时候我们可以看到原本隐藏在侧边栏盒子里面的span便签显示出来了。

二、案例代码


<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
    <style>
        * {
            margin: 0;
            padding: 0;
            color: #fff;
        }

        .w {
            width: 1000px;
            margin: 0 auto;
        }

        .header {
            height: 300px;
            background-color: purple;
        }

        .main {
            height: 700px;
            background-color: green;
        }

        .footer {
            height: 1000px;
            background-color: skyblue;
        }

        .slider-bar {
            position: absolute;
            width: 70px;
            height: 200px;
            top: 400px;
            right: 100px;
            background-color: blue;
        }

        .back {
            /* 先隐藏起来 */
            display: none;
        }
    style>
head>

<body>
    <div class="slider-bar">
        <span class="back">返回顶部span>
    div>
    <div class="header w">头部区域div>
    <div class="main w">主体部分div>
    <div class="footer w">尾部区域div>
    <script>
        var sliderbar = document.querySelector('.slider-bar');
        var main = document.querySelector('.main');
        var footer = document.querySelector('.footer');
        var back = document.querySelector('.back');
        // 获取main盒子距离顶部的高度
        var mainTop = main.offsetTop;
        // 获取footer盒子距离顶部的高度
        var footerTop = footer.offsetTop;
        console.log(footerTop);
        // 用侧边栏原先跟顶部的距离减去mainTop盒子跟顶部的距离得到侧边栏变成固定定位后的距离
        var sliderbarTop = sliderbar.offsetTop - mainTop;
        document.addEventListener('scroll', function () {
            // window.pageYOffset返回文档当前沿垂直轴（即向上或向下）滚动的像素数
            if (window.pageYOffset >= mainTop) {
                sliderbar.style.position = 'fixed';
                sliderbar.style.top = sliderbarTop + 'px';
            } else {
                sliderbar.style.position = 'absolute';
                sliderbar.style.top = '400px';
            }
            if (window.pageYOffset >= footerTop) {
                back.style.display = 'block';
            } else {
                back.style.display = 'none';
            }
        })
    script>
body>

html>

总结

学习前端将每天学到的小案例分享给大家，写的不好的地方还望大家多多指教。

你可能感兴趣的:(前端学习之小案例,html,css,js)

  • CSS 样式设计：背景、字体与边框渐变详解 前端呆猿 css前端
    一、CSS背景渐变CSS背景渐变是现代网页设计中常用的技术，可以创建平滑的颜色过渡效果，替代传统的静态背景图像。1.线性渐变(LinearGradient).element{background:linear-gradient(toright,#ff7e5f,#feb47b);}方向参数：toright、toleft、tobottom、totop，或角度如45deg可以添加多个颜色节点：linea
  • （详细文档）java web在线商城系统（jsp + servlet） 熊猫发电机：miniqq207 实训项目数据仓库大数据
    目录一、设计任务......................................................................................41.1设计意义................................................................................41.2设计目的..........
  • 微信小程序分包 難釋懷 微信小程序小程序
    一、前言随着微信小程序功能的不断扩展，代码体积也逐渐增大。而微信小程序对主包大小限制为2MB（压缩后），超过这个限制将无法上传发布。为了解决这一问题，小程序分包机制应运而生——它允许我们将一个大型小程序拆分为多个子包，按需加载，从而突破大小限制并提升首屏加载速度。本文将带你全面掌握：✅小程序分包的基本原理✅分包的配置方式（app.json）✅主包与子包的通信机制✅页面路径的引用规则✅分包预下载策略
  • 有所思之干货vs水货 勤劳的farmer
    许久没有开始敲钱盘写写自己最近的心得和感悟啦！刚好这两天的感悟蛮多的，所以写写。最近高能的冼姐邀请我加入南宁演讲群，一起成长学习，期间也单独找我聊着，鼓励我去霸占舞台，突破自我！在群里看到群友对冼姐的称呼是“冼主席”，还有每次冼姐发的活动文案感觉每次都是非常的用心的表达自己，帮助别人！能量超级强！只讲重点！！也讲到了会拖着我前进，期间给我说了一句话让我印象深刻：“人生不疯几次，怎么能做的了大事呢？
  • 好的婚姻，离不开仪式感 悠悠舜华
    不知不觉间，婚姻已经进行到第五个念头，曾经不止一次感慨老公不懂浪漫，可是自从圣诞节老公出乎意外地为我准备了一份礼物，就像突然间开了窍，隔三差五来点小惊喜，我当然喜笑颜开，夫妻关系也因此更加和谐了。其实好的婚姻，不正需要这样的仪式感吗？一段关系的确立，如果与物质挂钩，我们往往会感觉失去了纯洁之美，好像爱情就应该是不食人间烟火的。其实不然，早在《诗经.野有死麕》中就为我们刻画了男子追求女子应有的态度。
  • CSS定位属性全解析 代码的余温 css前端
    CSS的position属性用于定义元素在文档中的定位方式，其属性值及作用如下：1.static（默认值）作用：元素遵循正常文档流，忽略top、right、bottom、left和z-index属性。特点：✓元素按源码顺序自然排列。✓无法通过方向属性调整位置。.element{position:static;}2.relative（相对定位）作用：元素相对于自身原位置进行偏移，原空间保留。特点：✓
  • 崔律·100天挑战阅读《奇特的一生》【《奇特的一生》·Day57·如何评价自己的一生（1） 冬夜读书YHY
    这是“崔律精时力之100天挑战《奇特的一生》阅读”系列，今天是2019年3月30日一个人在离开了这个世界上以后。后人对他的评价是什么样子，在某种程度上也就决定了这个人在他的有生之年对这个世界做出的贡献吧。柳翁一生有一件非常固执的事情，就是长达几十年的时间记录时间统计时间计划。因为他的这种非常近乎于苛刻的这种方式，让他获得了很多的成就。同时，以它在生物学上的一些贡献，让他的后来的后继者会记住。会沿着
  • 从零开发推客小程序系统：完整技术方案与实战经验 wx_ywyy6798 小程序推客小程序开发推客系统开发微信小程序推客小程序推客系统推客分销系统开发
    一、推客小程序的市场价值社交电商爆发式增长背景推客模式的优势：低成本获客、用户裂变小程序作为推客系统载体的天然优势二、技术架构设计text1.前端技术栈：-微信小程序原生开发/uni-app跨平台方案-自定义分享组件开发-可视化数据看板实现2.后端技术选型：-Node.js/PHP/JavaSpringBoot等后端框架对比-高性能分销关系链存储方案-佣金结算系统的设计要点3.数据库设计：-用户层
  • linux如何使用jstack分析线程状态 ycllycll linux
    在高并发，多线程环境下的java程序经常需要分析线程状态，本本是一个分析步骤无具体讲解（具体命令可自行google学习）一般流程：1.使用jps-l查看有哪些java程序在运行2.使用top查看步骤1中进程号（pid或者vmid）所占用cpu以及内存情况（或者省略步骤1）3.使用top-Hppid查看具体该pid下各个线程所占用的cpu情况（进程下的线程有一个nid，后面需要用到）4.使用jsta
  • sql优化之延迟关联 ycllycll mysqlsql数据库
    具体看这个文章，写得非常不错：mysql优化：覆盖索引（延迟关联）-一枝花算不算浪漫-博客园看完后思考：1.业务相关的表规范上都要设置递增的主键字段，便于后续优化2.很多时候sql查询的性能瓶颈基本都在io上而不是cpu，所以才会这么优化，尽量在sql的where条件后都走主键，不要让sql走回表操作3.博客中改造的sql比较适合大表跟小表的关联情形
  • R语言 绘制散点图 Ora_ge R语音
    ［转自：http://blog.sina.com.cn/s/blog_69ffa1f90101siek.html］函数。简单地说，把一些R语句（赋值、计算或其他操作步骤）包装起来并给它一个名称，这就是函数。我们前面接触过的getClass(),class(),head(),rep(),cbind(),rbind()等都是函数。显示（打印）对象也有函数print()，但R有更简单的方法：输入对象名（
  • 2023-05-09 贤知国学
    曾子曰：“君子以文会友，以友辅仁。”——《论语·颜渊》曾子说：“君子以谈文论艺来与朋友相聚，再以这样的朋友来帮助自己走上人生正途。”“以文会友”，此“文”非指文章，而是经纬天地。以经纬天下之术会友。“朋友切切偲偲”，讲学论道。“以友辅仁”，彼此帮助而成仁，成功了则成仁政，即“王道成矣”。文会，第一步;友仁，是结果。称友仁社，不称文会了。发展三三两两，成立“友仁社”。今后一举一动都有因果，不是空的。
  • 【人工智能之深度学习】6. 卷积核工作原理：从边缘检测到特征抽象的逐层演进（附可视化工具与行业实战代码） AI_DL_CODE 人工智能深度学习卷积核特征提取卷积神经网络边缘检测特征可视化
    摘要：卷积核是卷积神经网络（CNN）的核心组件，其通过局部感受野与参数共享机制实现高效特征提取。本文从数学本质出发，揭示卷积操作的空域-频域对偶性：空域卷积等价于频域乘积（F{f∗g}=F{f}⋅F{g}F\{f*g\}=F\{f\}⋅F\{g\}F{f∗g}=F{f}⋅F{g}），解释边缘检测核（Sobel、Laplacian）的频域响应特性。通过特征可视化实验表明，CNN特征呈现逐层抽象规律：
  • 混合开发Hybrid，JSBridge原理简述 永恒即是最美
    混合开发（Hybrid），是一种开发模式，指使用多种开发模型开发App。一般有两大模式：原生Native、WebH5。混合开发时，原生、Web相互通信都离不开JSBridge。JSBridge：以JavaScript引擎或Webview容器作为媒介，通过协定协议进行通信，实现Native端和Web端双向通信的一种机制。（webView是移动端提供的运行JavaScript的环境，是系统渲染Web网
  • 和生活死磕到底 Echo念念
    懒惰是很奇怪的东西，它使你以为那是安逸，是休息，是福气，但实际上它所给你的是无聊，是倦怠，是消沉；它剥夺你对前途的希望，割断你和别人之间的友情，使你心胸日渐狭窄，对人生也越来越怀疑。--罗兰《忙碌进取》无需时刻保持敏感，迟钝有时即为美德。尤其与人交往时，即便看透了对方的某种行为或者想法的动机，也需装出一副迟钝的样子。此乃社交之诀窍，亦是对人的怜恤。--尼采人生就像迷宫，我们用上半生找寻入口，用下半
  • 2023-05-02|老子|第六十二章| 一生的宝藏 陆颜
    道者万物之奥----老子《道德经》第六十二章道是万物的归处，万物的家园，万物根本的藏身之处。遵循大道是事情成功的唯一标准，每一件事情背后都有所遵循的规律，我们要看到这个规律，就像是窥探到天机，打开了天眼，活得通透；也像找到了宝藏，还必须得打开潘多拉魔盒，不害怕才能活得精彩。我们工作中的大道是什么？我认为企业的使命、愿景、价值观，这是一家公司的大道，如果没有就像是一艘要下海远航的船，全速前进，他却不
  • 【读书笔记】《做高效能父母》之接纳：关系是一切管教的基础 端端妈
    一、没有人比我更爱孩子，但我真的接纳他吗？三个孩子的宝妈，由于居住环境的改变，发现原本听话的3个孩子，每个人都发生了变化，都在变得不听话了，于是妈妈开始反省自己的过失，给我们分享了正面管教的四个有效管教标准和6A课程。正面管教的四个有效管教标准1.是否和善与坚定并行？2.是否有助于孩子感受到归属感和价值感？3.是否长期有效？4.是否能教给孩子有价值的社会技能和人生技能，培养孩子的良好品格？6A课程
  • 数字图像处理（三：图像如果当作矩阵，那加减乘除处理了矩阵，那图像咋变）：从LED冬奥会、奥运会及春晚等等大屏，到手机小屏，快来挖一挖里面都有什么
    数字图像处理（三）一、（准备工作：咋玩，用什么玩具）图像以矩阵形式存储，那矩阵一变、图像立刻跟着变？1.Python+JupyterNotebook/Lab+库(NumPy,OpenCV,Matplotlib,scikit-image)2.MATLAB+ImageProcessingToolbox3.JavaScript+HTML5Canvas+浏览器4.专业的图像处理软件(带脚本/插件功能)二、
  • 做好销售之道：抛弃打工者心态，拥有创业者思维！附赠销售秘籍 启哥笔记
    好习惯会成就你，坏习惯正慢慢毁掉你......销售是靠提成吃饭的，有的销售干得风生水起，一个月赚三、五万，甚至上十万，看起来毫不费力；有的销售看上去很努力，却偏偏拿不到与之相匹配的好业绩，难免会问自己一句，到底是哪里出了问题？归根结底，普通销售业绩迟迟未能突破的原因，一是没有掌握足够灵活和娴熟的销售技巧，二是自己养成的坏习惯正在不知不觉把自己毁掉。坏习惯貌似不起眼，实际上却顽强而巨大，很大程度上成
  • 启新教育趣辅导02501120301_颜鹏程感悟 小饼干呀啦嘿
    关键词：不带评论的观察今日感悟：对于自己看到的事物不宜用肆意评论的方式对待，最好通过观察，用语言描述你观察的结果。我本身就有这一毛病，教我弟订正练习的时候，我经常说，你跟个小猪似的，这么简单的就都不会做。虽然在自己看来是句玩笑话（我笑着说的），但总避免不了他有抵触情绪跟我对着讲乘口舌之快，浪费时间。现在看来应该换成：这道题我的解是。。。你看看对你是否有帮助？我弟弟是蛮要面子的一个人，以一个平等的学
  • 晨语问安2023年7月30日 求索大伟
    『晨语问安7.30』小心过的千帆渡，大意阴沟里翻船。惟有小心翼翼注重细节方能行稳致远，马虎大意马大哈式做派只能举步维艰自讨没趣。惟有时刻警醒，时时谨慎，事事小心，方能走得更远。事实基本上明明白白清清楚楚摆在面前，即使有所隐瞒也是换了一种方式，犹如化妆一样在本来面目上进行了修饰，让肉眼所看到的与实际所有有了隔膜。在虚幻面前，依旧用老眼光去看，依然采取常规手法，依是惯例思维对待，势必得到差之毫厘失之千
  • 小时候之河岸边的树林 七月的旧时光
    河岸边有一片树林，草地，沙滩。这一片树林是村子里孩子们玩耍的好地方。小时候和小伙伴们爬树，烤红薯，荡秋千，玩起来就是一个下午，累了就跳到水里泡泡澡，在河中摸摸石头、抓抓鱼，原来小时候无忧无虑的时光是和才大自然最亲近的时候。
  • XSS介绍及利用 0x00dream 常见漏洞webjavascript
    XSS——跨站脚本攻击XSS介绍及利用**XSS的三种类型****构造xss脚本****自动化XSS——BeEF**XSS介绍及利用1、XSS介绍XSS（crosssitescripting）跨站脚本攻击，恶意攻击者往web页面里插入恶意script代码，当用户浏览该页面时，代码就会被执行2、XSS原理在HTML中常用到字符实体，对常用到的字符实体没有进行转译，导致完整的标签出现，在可输入的文本框
  • springboot-mybatis-MySQL-集成 张_皮皮 springbootmybatismavenspringbootmybatisidea
    这也是我第一次搭建springboot-mybatis的项目环境，记录一下。我是用IntelliJIDEA，你可以创建maven项目，也可以直接创建spring项目，最终的项目结构如下，这里说明下，resources下面的mappers里面是存放mybatis的SQL映射文件，static下面存放前端静态资源文件，如js,css等，template下存放前端模板文件，本项目使用的freemarke
  • 芸芸众生，每个人都该是独特的那一个|《乌合之众：大众心理研究》7月24日 酒肆的小酒
    文/酒肆的小酒《乌合之众：大众心理研究》，最早出版于1895年，[法]古斯塔夫·勒庞。《乌合之众》今天开始读《乌合之众》真好本书，说实话，看完序章已经耗完了我的精气神…感觉有些晦涩难懂，准备慢慢啃，斟字酌句了……看到目前，很多话都像是这样：“在以前被视为没有讨论余地的许多观念的废墟之上，以及在当今许多连续革命的根源历经沧桑或一度腐烂并遭到破坏之后，这种力量已经成为它们的替代品，而且看起来注定要将它
  • 2018-03-07 啊糖呀
    中午回家，问他在学校都发生了哪些趣事，不问还好，一问才知道，又在学校给我惹事了。我一直告诉自己，男孩子调皮一点，实属正常，谁让我是男孩子的妈妈。平日里，那是一个脱跳，跟同学在学校偶有摩擦，但也有时兴奋过了头还挂个彩回来，我能怎么办，我也很无奈。教育吗，那苦口婆心我说的少吗，下手吗，适当使用武力是我的权利。可然并卵~每次眼泪汪汪的看着你，一副委屈却依然痛改前非的模样，晓之以理，动之以情，痛之以棍，有
  • 好看的完结小说狐嫁仙寻仙嫁(欢喜狐余爻孟浪)_狐嫁仙寻仙嫁(欢喜狐余爻孟浪)完结好看小说 小富江呀
    《狐嫁仙》主角：余爻孟浪，简介：我是一名婚奴。京城皆知我的名声。我要做的便是调教那些即将新婚的男人，通晓房中之术。我恪守本分，专心做我的婚奴。谁知那一个个王孙贵族却纷纷上找我，要娶我为妻？吓得我火速立了女户，打算孤独终老。但那些男人还偏偏非我不可的架势。这可怎么办才好？直到友人试探一句道，“不如都收了？”我一顿，“你当他们是什么人？他们个个尊贵自傲，定然不同意。”谁知男人们竟然跳出来各个争起了大房
  • 嘉兴正规的亲子鉴定中心在哪(附2024年最新亲子鉴定办理流程) 成之嘉_基因检测
    2024年嘉兴最新亲子鉴定收费标准：个人隐私亲子鉴定收费标准：￥2000-￥2400，常见用途：怀疑孩子的父亲身份，想私下偷偷检测；无创胎儿亲子鉴定收费标准：￥4500-￥5000，常见用途：孩子未出世，怀疑胎儿的父亲身份，想思想偷偷检测；司法亲子鉴定收费标准：￥2400-￥3600，常见用途：上户口、移民；成之嘉亲子鉴定优势1、全程匿名2、快速出结果3、检测更精准口号：每一次检测都是一份责任联系
  • 大师兄点评大秦帝国|第十三讲：百年雄文求贤令（三） 大师兄缪玮76
    大秦帝国第十三集：百年雄文求贤令上导读：以人以史为镜，提升人文素质。大家好，欢迎收看大师兄点评大秦帝国。第一部裂变，第二篇，君臣互选。我们的节目也会每周在大师兄微课堂和喜马拉雅、同步更新。在这一讲中，我们看到卫鞅在韩国遇百里子和玄奇，更见到了白雪和梅姑，大喜过望，了解秦公求贤令，卫鞅一见，大为震动，叹为五百年一卷雄文，明确了入秦之志。01.再谈爱情谈完卫鞅和申不害的君子之约，我们紧接着谈谈卫鞅和白
  • 深入理解浏览器解析机制和XSS向量编码 lq_ioi_pl xss前端编码
    URL编码"javascript:alert(1)"---->%6a%61%76%61%73%63%72%69%70%74:%61%6c%65%72%74%28%31%29aaa-------浏览器解析不了。页面识别在url解码之前，在识别标签和属性的时候还没解码，页面就不认识这串编码，不会把它们当作JS代码执行页面识别的时候，已经进行HTML实体解码，变成了aaaaa浏览器会识别它为可执行JS代
  • PHP，安卓，UI，java，linux视频教程合集 cocos2d-x小菜 javaUIPHPandroidlinux
    ╔-----------------------------------╗┆                           
  • 各表中的列名必须唯一。在表 'dbo.XXX' 中多次指定了列名 'XXX'。 bozch .net.net mvc
    在.net mvc5中，在执行某一操作的时候，出现了如下错误：       各表中的列名必须唯一。在表 'dbo.XXX' 中多次指定了列名 'XXX'。 经查询当前的操作与错误内容无关，经过对错误信息的排查发现，事故出现在数据库迁移上。 回想过去： 在迁移之前已经对数据库进行了添加字段操作，再次进行迁移插入XXX字段的时候，就会提示如上错误。  &
  • Java 对象大小的计算 e200702084 java
                              Java对象的大小 如何计算一个对象的大小呢？    
  • Mybatis Spring 171815164 mybatis
    ApplicationContext ac = new ClassPathXmlApplicationContext("applicationContext.xml"); CustomerService userService = (CustomerService) ac.getBean("customerService"); Customer cust
  • JVM 不稳定参数 g21121 jvm
            -XX 参数被称为不稳定参数，之所以这么叫是因为此类参数的设置很容易引起JVM 性能上的差异，使JVM 存在极大的不稳定性。当然这是在非合理设置的前提下，如果此类参数设置合理讲大大提高JVM 的性能及稳定性。        可以说“不稳定参数”
  • 用户自动登录网站 永夜-极光 用户
    1.目标:实现用户登录后,再次登录就自动登录,无需用户名和密码 2.思路:将用户的信息保存为cookie            每次用户访问网站,通过filter拦截所有请求,在filter中读取所有的cookie,如果找到了保存登录信息的cookie,那么在cookie中读取登录信息,然后直接
  • centos7 安装后失去win7的引导记录 程序员是怎么炼成的 操作系统
    1.使用root身份(必须)打开 /boot/grub2/grub.cfg 2.找到 ### BEGIN /etc/grub.d/30_os-prober ###   在后面添加    menuentry "Windows 7 (loader) (on /dev/sda1)" { 
  • Oracle 10g 官方中文安装帮助文档以及Oracle官方中文教程文档下载 aijuans oracle
    Oracle 10g 官方中文安装帮助文档下载：http://download.csdn.net/tag/Oracle%E4%B8%AD%E6%96%87API%EF%BC%8COracle%E4%B8%AD%E6%96%87%E6%96%87%E6%A1%A3%EF%BC%8Coracle%E5%AD%A6%E4%B9%A0%E6%96%87%E6%A1%A3 Oracle 10g 官方中文教程
  • JavaEE开源快速开发平台G4Studio_V3.2发布了 無為子 AOPoraclemysqljavaeeG4Studio
      我非常高兴地宣布,今天我们最新的JavaEE开源快速开发平台G4Studio_V3.2版本已经正式发布。大家可以通过如下地址下载。   访问G4Studio网站 http://www.g4it.org   G4Studio_V3.2版本变更日志 功能新增 (1).新增了系统右下角滑出提示窗口功能。 (2).新增了文件资源的Zip压缩和解压缩
  • Oracle常用的单行函数应用技巧总结 百合不是茶 日期函数转换函数(核心)数字函数通用函数(核心)字符函数
    单行函数;   字符函数,数字函数,日期函数,转换函数(核心),通用函数(核心) 一:字符函数: .UPPER(字符串) 将字符串转为大写 .LOWER (字符串) 将字符串转为小写 .INITCAP(字符串) 将首字母大写 .LENGTH (字符串) 字符串的长度 .REPLACE(字符串,'A','_') 将字符串字符A转换成_
  • Mockito异常测试实例 bijian1013 java单元测试mockito
    Mockito异常测试实例： package com.bijian.study; import static org.mockito.Mockito.mock; import static org.mockito.Mockito.when; import org.junit.Assert; import org.junit.Test; import org.mockito.
  • GA与量子恒道统计 Bill_chen JavaScript浏览器百度Google防火墙
    前一阵子，统计**网址时，Google Analytics（GA） 和量子恒道统计（也称量子统计），数据有较大的偏差，仔细找相关资料研究了下，总结如下：   为何GA和量子网站统计（量子统计前身为雅虎统计）结果不同？ 首先：没有一种网站统计工具能保证百分之百的准确出现该问题可能有以下几个原因：（1）不同的统计分析系统的算法机制不同；（2）统计代码放置的位置和前后
  • 【Linux命令三】Top命令 bit1129 linux命令
    Linux的Top命令类似于Windows的任务管理器，可以查看当前系统的运行情况，包括CPU、内存的使用情况等。如下是一个Top命令的执行结果：     top - 21:22:04 up 1 day, 23:49, 1 user, load average: 1.10, 1.66, 1.99 Tasks: 202 total, 4 running, 198 sl
  • spring四种依赖注入方式 白糖_ spring
      平常的java开发中，程序员在某个类中需要依赖其它类的方法，则通常是new一个依赖类再调用类实例的方法，这种开发存在的问题是new的类实例不好统一管理，spring提出了依赖注入的思想，即依赖类不由程序员实例化，而是通过spring容器帮我们new指定实例并且将实例注入到需要该对象的类中。依赖注入的另一种说法是“控制反转”，通俗的理解是：平常我们new一个实例，这个实例的控制权是我
  • angular.injector boyitech AngularJSAngularJS API
    angular.injector   描述: 创建一个injector对象, 调用injector对象的方法可以获得angular的service, 或者用来做依赖注入.   使用方法: angular.injector(modules, [strictDi])   参数详解: Param Type Details mod
  • java-同步访问一个数组Integer[10]，生产者不断地往数组放入整数1000，数组满时等待；消费者不断地将数组里面的数置零，数组空时等待 bylijinnan Integer
    public class PC { /** * 题目：生产者-消费者。 * 同步访问一个数组Integer[10]，生产者不断地往数组放入整数1000，数组满时等待；消费者不断地将数组里面的数置零，数组空时等待。 */ private static final Integer[] val=new Integer[10]; private static
  • 使用Struts2.2.1配置 Chen.H apachespringWebxmlstruts
    Struts2.2.1 需要如下 jar包: commons-fileupload-1.2.1.jar commons-io-1.3.2.jar commons-logging-1.0.4.jar freemarker-2.3.16.jar javassist-3.7.ga.jar ognl-3.0.jar spring.jar struts2-core-2.2.1.jar struts2-sp
  • [职业与教育]青春之歌 comsci 教育
           每个人都有自己的青春之歌............但是我要说的却不是青春...        大家如果在自己的职业生涯没有给自己以后创业留一点点机会,仅仅凭学历和人脉关系,是难以在竞争激烈的市场中生存下去的....   &nbs
  • oracle连接(join)中使用using关键字 daizj JOINoraclesqlusing
    在oracle连接(join)中使用using关键字 34. View the Exhibit and examine the structure of the ORDERS and ORDER_ITEMS tables. Evaluate the following SQL statement: SELECT oi.order_id, product_id, order_date FRO
  • NIO示例 daysinsun nio
    NIO服务端代码： public class NIOServer { private Selector selector; public void startServer(int port) throws IOException { ServerSocketChannel serverChannel = ServerSocketChannel.open(
  • C语言学习homework1 dcj3sjt126com chomework
    0、 课堂练习做完 1、使用sizeof计算出你所知道的所有的类型占用的空间。 int x; sizeof(x);   sizeof(int);   # include <stdio.h> int main(void) { int x1; char x2; double x3; float x4; printf(&quo
  • select in order by , mysql排序 dcj3sjt126com mysql
    If i select like this: SELECT id FROM users WHERE id IN(3,4,8,1); This by default will select users in this order 1,3,4,8, I would like to select them in the same order that i put IN() values so:
  • 页面校验-新建项目 fanxiaolong 页面校验
    $(document).ready( function() { var flag = true; $('#changeform').submit(function() { var projectScValNull = true; var s =""; var parent_id = $("#parent_id").v
  • Ehcache（02）——ehcache.xml简介 234390216 ehcacheehcache.xml简介
    ehcache.xml简介          ehcache.xml文件是用来定义Ehcache的配置信息的，更准确的来说它是定义CacheManager的配置信息的。根据之前我们在《Ehcache简介》一文中对CacheManager的介绍我们知道一切Ehcache的应用都是从CacheManager开始的。在不指定配置信
  • junit 4.11中三个新功能 jackyrong java
    junit 4.11中两个新增的功能，首先是注解中可以参数化，比如 import static org.junit.Assert.assertEquals; import java.util.Arrays; import org.junit.Test; import org.junit.runner.RunWith; import org.junit.runn
  • 国外程序员爱用苹果Mac电脑的10大理由 php教程分享 windowsPHPunixMicrosoftperl
    Mac 在国外很受欢迎，尤其是在 设计/web开发/IT 人员圈子里。普通用户喜欢 Mac 可以理解，毕竟 Mac 设计美观，简单好用，没有病毒。那么为什么专业人士也对 Mac 情有独钟呢？从个人使用经验来看我想有下面几个原因： 1、Mac OS X 是基于 Unix 的 这一点太重要了，尤其是对开发人员，至少对于我来说很重要，这意味着Unix 下一堆好用的工具都可以随手捡到。如果你是个 wi
  • 位运算、异或的实际应用 wenjinglian 位运算
    一． 位操作基础，用一张表描述位操作符的应用规则并详细解释。       二． 常用位操作小技巧，有判断奇偶、交换两数、变换符号、求绝对值。       三． 位操作与空间压缩，针对筛素数进行空间压缩。    &n
  • weblogic部署项目出现的一些问题（持续补充中……） Everyday都不同 weblogic部署失败
    好吧，weblogic的问题确实……   问题一： org.springframework.beans.factory.BeanDefinitionStoreException: Failed to read candidate component class: URL [zip:E:/weblogic/user_projects/domains/base_domain/serve
  • tomcat7性能调优（01） toknowme tomcat7
        Tomcat优化： 1、最大连接数最大线程等设置 <Connector port="8082" protocol="HTTP/1.1"                useBodyEncodingForURI="t
  • PO VO DAO DTO BO TO概念与区别 xp9802 javaDAO设计模式bean领域模型
    O/R Mapping 是 Object Relational Mapping（对象关系映射）的缩写。通俗点讲，就是将对象与关系数据库绑定，用对象来表示关系数据。在O/R Mapping的世界里，有两个基本的也是重要的东东需要了解，即VO，PO。 它们的关系应该是相互独立的，一个VO可以只是PO的部分，也可以是多个PO构成，同样也可以等同于一个PO（指的是他们的属性）。这样，PO独立出来，数据持
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他