$(this).scroll(function() { // 页面发生scroll事件时触发
代码来自网络~ /*任意位置浮动固定层*/ /*调用： 1 无参数调用：默认浮动在右下角 $("#id").floatdiv(); 2 内置固定位置浮动 //右下角 $("#id").floatdiv("rightbottom"); //左下角 $("#id").floatdiv("leftbottom"); //右下角 $("#id").floatdiv("rightbottom"); //左上角 $("#id").floatdiv("lefttop"); //右上角 $("#id").floatdiv
现在的网页设计中，浮动导航菜单被广泛应用了，通过它，可以可以快速移动到菜单，Smint 就是这样一个简单的 jQuery 插件，可以将导航菜单浮动在页面的顶部，点击菜单快速滚动到达页面的位置，并且能够设置滚动的速度。
<!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> <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /> <title>jquery弹出层浮动层代码</title> <script src=”/ajaxjs/jquery1.3.2.js” type=”text/javascript”></script> <style> *{ margin:0; padding:0} body{ margin:0; padding:0; font-size:12px} ul,li{ list-style:none} ul{position:relative;top:-3px; left:-3px;border:1px solid #ccc; background:#fff;} li{height:23px;line-height:23px;cursor:default; padding:0 0 0 10px} li.current{background:#eee} .wrap{ width:158px; background:#eee; position:absolute;} </style> <script type=”text/javascript”> $(function(){ $(“.wrap”).hide(); var objW=$(“.wrap”).width(); var objH=$(“.wrap”).height(); $(document).mousedown(function(e){ var selfX=objW+e.pageX; var selfY=objH+e.pageY var bodyW=document.documentElement.clientWidth+document.documentElement.scrollLeft; var bodyH=document.documentElement.clientHeight+document.documentElement.scrollTop; if(selfX>bodyW && selfY>bodyH){ $(“.wrap”).css({top:(bodyH-objH),left:(bodyW-objW)}).show(); }else if(selfY>bodyH){ $(“.wrap”).css({top:(bodyH-objH),left:e.pageX}).show(); }else if(selfX>bodyW){ $(“.wrap”).css({top:e.pageY,left:(bodyW-objW)}).show(); }else{ $(“.wrap”).css({top:e.pageY,left:e.pageX}).show(); } }) $(“li”).hover(function(){ $(this).addClass(“current”); },function(){ $(this).removeClass(“current”); }).click(function(){ alert($(this).text()) $(this).parent().parent().hide(); }) }) </script> </head> <body> 请按F5刷新，才干看到效果。点击鼠标左键，弹出层，在最右边点击时03
· 3.优化CSS（压缩合并css，如margin-top,margin-left…)
轻量级框架jQuery Mobile 所需文件 <link rel="stylesheet" href="jquery.mobile-1.1.2/jquery.mobile-1.1.2.css"/> <script type="text/javascript" src="jquery.mobile-1.1.2/jquery-1.6.4.js"></script> jquery 应放在 mobile 上面。 <script typ
最近 GitHub 热榜上持续有一个这样的 Python 项目，自称「100天从新手到大师」。目前 Star 数量已有 19000 多。
position的值， relative和absolute分别是相对于谁进行定位的？
encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。
最近在弄毕业设计，总有个现象，就是一个段落，自己吐墨水的话，吐不超过两句就吐完了。回头看看博客，发现这一年来，才3篇文章，原来是这样才缺乏墨水啊。
作者：@markyun markyun.github.io/2015/Front-end-Developer-Questions/ HTML Doctype作用？严格模式与混杂模式如何区分？它们有何意
HTML Doctype作用？严格模式与混杂模式如何区分？它们有何意义? HTML5 为什么只需要写 ？ 行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？ 页面导入样式时，使用link和@
块标签 每一个块属性标签都是从新的一行开始，而且之后的元素也都会从新的一行开始 可以设置宽度、高度，行高，距顶部距离，距底部距离 块属性标签的宽度假如不做设置，会直接默认为父元素宽度的100% 块属性标签是可以直接嵌套的 p标签中不能嵌套div标签
HTML5学堂：如何优化前端页面 / 如何优化网页。作为前端开发人员来说，不但要开发出能兼容各大主流浏览器的页面，而且还需要懂得去优化前端页面。本文主要给大家讲解如何去优化页面。 1 前期准备 1.1 首页命名为index.html / index.htm / index.php等。 1.2 需要制作404页面。 1.3 文件夹结构合理。 1.4 命名使用英文且有语义性的单词，并提供参考文档。 2 结构 2.1 文件头部分 2.1.1 需要提供文档声明 2.1.2 设置utf-8的编码格式，并放置于titl
该段落使用了样式 "text-muted"。
终于做完了网页(很简略!!!),但是也花了我不少时间,这篇文章决定详细的讲解,顺便也当做是复习巩固了,因为自己做的时候真的踩了很多坑...
圣杯布局和双飞翼布局一直是前端面试的高频考点，圣杯布局的出现是来自由 Matthew Levine 在 2006 年写的一篇文章 《In Search of the Holy Grail》。 比起双飞翼布局，它的起源不是源于对页面的形象表达。在西方，圣杯是表达“渴求之物”的意思。而双飞翼布局则是源于淘宝的UED，可以说是灵感来自于页面渲染。
Bootstrap学习有两个重点，一个是概念的理解，理解bootstrap是如何通过div来代替过去的table布局的；一个是常用结构的熟悉，做到需要的组件及时能找到，组合一下就可以满足需求。学习后的
前两天下午四点打过来的电话，没接到。因为是座机分机所以不能打过去（试了几次，这个事情告诉我们手机要随身携带，万一面试官用座机打的，你还不能回拨）。于是我等啊等，终于在快七点面试官给我打过来了。阿里面试的用户体验是真的好，面试官很耐心。再次感谢阿里hr都很好，昨天查了状态已回绝。自己实力不够，还需继续修炼 先说说总体情况面了三十多分钟，我问问题用了十几分钟，总共四十多分钟。基本的问题回答出来了，但是本人比较内向，不是很会接话茬子有点尬聊。每次回答完一个问题，就安静了几秒钟。基本问题都回答出来了，然后再一点点
学习牛腩时，也刚刚结束个人重构，所曾经面差点儿相同1/3的部分感觉都非常熟悉，非常上手，包含数据库设计和B、D层代码的编写。当中重新理解了SQLHelper的完美演化、存储过程的强大。使用了触发器初探（触发器建好以后看不到，但能够查询出来，后来发现原来在每张表的以下），接着就是站点的建立，事实上和三层差点儿相同，web层相当于我们的UI层，仅仅只是之前我们的控件放在窗口中。如今放在网页中，然后引用CSS样式来控制html中各控件属性，真正做到网页表现与内容分离的一种样式设计语言 。
以前我接受了网上不少博文的说法，一直认为学习css的三大最重要问题是：盒模型、定位、浮动。因为这三块的内容决定了css布局的能力。但是通过上一篇日志的分析，xhtml要实现和css的解耦，就要尽量不依赖于css（或者说不要纯粹为了给css预留接口而添加不必要的class和id），那么，在用css布局之前，其实就有一个更紧迫的任务摆在我们的面前——如何将css规则准确应用到目标元素。于是，css选择符的地位在这个前提下就空前的提高了。所以，在开始学习盒模型、浮动、定位之前，有必要回顾一下选择符。 一般稍微接触
学习原生js的人一定会接触到client家族、scroll家族和offset家族。其中clienHeight、scrollHeight和offsetHeight一般用来求网页内容的高度，而对应的clientWidth、scrollWidth和offsetWidth则用来求网页内容的宽度，由于width和Height属性是类似的，所以这里我只挑这三个height来讲一下。
使用动画的过程中，如果在同一个元素上调用一个以上的动画方法，那么对这个元素来说，除了当前正在调用的动画，其他的动画将被放到效果队列中，这样就形成了动画队列。
在线演示地址：https://haiyong.site/demo/duanwu
本教程是，原文章发布系统教程的精编重制版，会包含每一节的源码，以及修正之前的一些错误。因为之前的教程只做到了评论模块，很多地方还不完美，因此重制版会修复之前的一些谬误和阐述不清的地方，而且，后期我会考虑完成该项目的后台管理。希望本教程提供的内容，可以成为JavaWeb初学者一套较为完整的练手项目。
缓存：ETag Expire Last-Modified 三者合用，Expire 可以让浏览器完全不发起 Http 请求，若 F5 发起请求，也可以通过判断 ETag（对应浏览器字段 If-None-Match） 和 Last-Modified （对应浏览器字段 If-Modified-Since）字段是否需要更新资源还是使用 304(Not Modified) 的本地资源；
这里总结一下 WEB 前端面试的常见问题，同时这些问题也是对一些基础的技术概念和思想的理解。对这些基本知识的掌握程度和深度决定了你的技术层级。高级工程师是必须掌握本文列出的这些知识的，资深工程师则要对这些基本概念的纵向深度进行挖掘（作者：YHSPY）。
网页简介：经过pink老师的课程学习之后，制作了一个简单的静态页面，主要是运用html和css。
1，说一下浏览器缓存 2，cookie 与 session 的区别 3，浏览器如何做到 session 的功能的。 4，解释一下：csrf 和 xss 5，怎么防止 csrf 和 xss 6，跨域的处理方案有哪些 7，CORS 是如何做的？ 8，对于 CORS ，Get 和 POST 有区别吗？ 9，了解 HTTPS 的过程吗？ 10，es module 和 commonjs 的区别 11，react 里如何做动态加载 12，动态加载的原理是啥，就是 webpack 编译出来的代码 13，写一个处理加法可能产生精度的函数，比如 0.1 + 0.2 = 0.3
一、轮播的实现原理 1.轮播是把需要轮播的图片浮动水平排列成一排。 2.然后设置一个视窗，大小等于一张图片。 3.视窗的overflow设置为hidden，溢出部分不可见。 4.点击下一页，所有图片就水平移动一个宽度。 5.如果要实现左右滚动无限循环的效果，就需要在图片列表开头和结尾分别添加最后一张图和第一张图 就像一张胶卷，每次展示一张图片，通过移动胶卷来切换可视的图片。 二、使用jquery实现图片自动轮播效果 <!DOCTYPE html> <html lang="en"> <h
设计个个人网站，利用CSS、JavaScript、HTML5、jQuery库和AJAX等
1.UI.Layout jQuery UI布局插件 官方网站：http://layout.jquery-dev.com/index.cfm 使用大小可折叠的嵌套面板和大量选项创建高级UI布局。布局
今天是七夕，一个对单身人士不怎么友好的一个节日，而对于已经有另外一半的情侣来说，今天应该是开心的一天，鲜花与巧克力也必然是在送去的路上。而对于众多程序员小哥哥们来说，他们在表达爱意的时候也会特别的别出
最近好多小伙伴都跳槽去找工作，我只能在心里默默的支持他们能找到一份好的工作，这份前端面试大全送给我的小伙伴们，主要说的是前端一些常用的一些知识，说的不对的地方请小伙伴们即使指正出来，自己同时也回顾下这些知识。主要分以下几个方边来说： - css和html - javascript - vue - 微信小程序
前言 前端之路何其漫漫~ 说明：本篇文章原是写给学弟学妹的，但想来花的功夫确实不少，就把此篇文章当做自己的一个阶段性总结文章了，会保持长期更新。 HTML 总的来说HTML并不难，甚至可以说很无脑……HTML的标签个人觉得过一遍就得，知道什么时候该用什么标签就可以了，因为在以后的开发中打交道最多的就是各种各样的标签，想不熟都难。就像现在我写这篇文章用的Markdown一样，只是几个标签的反复应用。那么html的学习就相对来说很自由了，可以跟着w3schoolW3school网址过一遍标签，网上也有很多其它网
这是一个关于IE6下绝对定位元素莫名消失的问题，该问题在IE6中一直存在，且没有明确的解决办法。本文通过分析该问题的表现和形成原因，提出了一些可能的解决办法，并附上了实例进行说明。
考虑到关注的小伙伴们也会有在校生或应届生，要参加校招的同学，一直挺想总结一些关于校招面试题，赶在春招结束前终于写完了，除了写到前端方面的面试题外，项目、职业发展、H面等高频问题也会有，写的很详细，全方面做好准备，为同学们的校招保驾护航！
- 由一对尖括号包裹的单词构成，如<html> 所有标签中的单词不可能从数据开头
Bootstrap介绍 Bootstrap是Twitter开源的基于HTML、CSS、JavaScript的前端框架。 它是为实现快速开发Web应用程序而设计的一套前端工具包。 它支持响应式布局，并且在V3版本之后坚持移动设备优先。 为什么要使用Bootstrap？ 在Bootstrap出现之前： 命名：重复、复杂、无意义（想个名字费劲） 样式：重复、冗余、不规范、不和谐 页面：错乱、不规范、不和谐 在使用Bootstrap之后： 各种命名都统一并且规范化。 页面风格统一，画面和谐。 Bootstrap下载
意义：根据内容的结构化（内容语义化），选择合适的标签（代码语义化）便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。 注意： 1.尽可能少的使用无语义的标签div和span； 2.在语义不明显时，既可以使用div或者p时，尽量用p, 因为p在默认情况下有上下间距，对兼容特殊终端有利； 3.不要使用纯样式标签，如：b、font、u等，改用css设置。 4.需要强调的文本，可以包含在strong或者em标签中（浏览器预设样式，能用CSS指定就不用他们），strong默认样式是加粗（不要用b），em是斜体（不用i）； 5.使用表格时，标题要用caption，表头用thead，主体部分用tbody包围，尾部用tfoot包围。表头和一般单元格要区分开，表头用th，单元格用td； 6.表单域要用fieldset标签包起来，并用legend标签说明表单的用途； 7.每个input标签对应的说明文本都需要使用label标签，并且通过为input设置id属性，在lable标签中设置for=someld来让说明文本和相对应的input关联起来。
在进行网也开发尤其是移动端页面开发，让程序员头疼的问题就是设备兼容性和自适应的，下面我来说一下我在工作中的一些方法。
相信上面两张图片上的输入框里有提示信息这功能大家都见过，有的人应该也自己动手做过。
HTML(1周) 了解HTML 常见标签及属性 会用Chrome，Firefox以及IE审查元素 能选择合适的标签来写页面 CSS(2周) 了解CSS 盒模型 常见选择器 常用规则 CSS的继承 CSS的层叠规则 position知识 浮动 布局 CSS Sprites Photoshop的简单使用(1天) Javascript(3周) 了解Javascript 基本语法 继承 闭包 DOM BOM HTTP协议 ajax 用静态服务器来做简单数据交互 常见框架(2周) JS jQuery und
前言 前端之路何其漫漫~ 说明：本篇文章原是写给学弟学妹的，但想来花的功夫确实不少，就把此篇文章当做自己的一个阶段性总结文章了，会保持长期更新。 HTML 总的来说HTML并不难，甚至可以说很无脑……HTML的标签个人觉得过一遍就得，知道什么时候该用什么标签就可以了，因为在以后的开发中打交道最多的就是各种各样的标签，想不熟都难。就像现在我写这篇文章用的Markdown一样，只是几个标签的反复应用。那么html的学习就相对来说很自由了，可以跟着w3schoolW3school网址过一遍标签，网
PornHub的FE，分享了P站前端一些实践，英文比较晦涩难懂，故翻译整理了一下，很多同学对前端技术不是很熟悉，故加入了简单解释，希望对大家理解相关技术有帮助。
本文由我收集总结了一些前端面试题，初学者阅后也要用心钻研其中的原理，重要知识需要系统学习、透彻学习，形成自己的知识链。万不可投机取巧，临时抱佛脚只求面试侥幸混过关是错误的！也是不可能的！不可能的！不可能的！
在父页面中定义函数，再到子页面中调用。 父页面parent.html function getFrameId(f){ var frames = document.getElementsByTagName(“iframe”); //获取父页面所有iframe for(i=0;i
在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其它框。
标准盒子模型：宽度=内容的宽度（content）+ border + padding + margin 低版本IE盒子模型：宽度=内容宽度（content+border+padding）+ margin
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频
