基于jQuery右下角旋转环状菜单代码。这是一款固定在页面的右下角位置，当用户点击了主菜单按钮后，子菜单项会以环状旋转进入页面，并使用animate.css来制作动画效果。效果图如下：

大家是否经常看到网页标题来回滚动，以及网页标题来回变动，这种效果是不是很炫，给人的感觉也不错。

下面就是我要分享给大家的代码，相互学习、改进已达到我们自己理想的状态。

js实现网页标题滚动（源码如下）

1
2
3
4
5
6
7
8
9
10

var msg = document.title; 

msg = "…" + msg;pos = 0; 
function scrollMSG() { 
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); 
pos++; 
if (pos >  msg.length) pos = 0 
window.setTimeout("scrollMSG()",400); 
} 
scrollMSG(); 

//跨浏览器添加事件

1
2
3
4
5
6
7
8
9

function addEvent(obj, type, fn) {
	if (obj.addEventListener) {
		obj.addEventListener(type, fn, false);
	} else if (obj.attachEvent) {
		obj.attachEvent('on' + type, function() {
			fn.call(obj);
		});
	}
}

URL即统一资源定位符 (Uniform Resource Locator, URL)，完整的URL由这几个部分构成：
scheme://host:port/path?query#fragment

scheme:通信协议，常用的http,ftp,maito等。

一、需求

我们经常会遇到【站内搜索】的需求，为了提高用户体验，我们希望能做到像百度那样的即时智能提示。例如：某公司人事管理系统，想搜索李XX，只要输入“李”，系统自然会提示一些姓李的员工，这样方便用户使用。说白了，就是用户边输入，系统会提示相关的结果；或者，当用户点击搜索框时，就推荐一些内容，如360、百度都会提示今天的主要新闻或搜索量大的内容。

//判断输入内容是否为空

1
2
3
4
5
6

function IsNull(){
var str = document.getElementById('str').value.trim();
if(str.length==0){
alert('对不起，文本框不能为空或者为空格!');//请将“文本框”改成你需要验证的属性名称!
}
}

1. Html 实例

1
2
3
4
5

<ul>
<li data-animal-type="bird">Owl</li>
<li data-animal-type="fish">Salmon</li>
<li data-animal-type="spider">Tarantula</li>
</ul>

1. 新的Doctype
尽管使用，即使浏览器不懂这句话也会按照标准模式去渲染

2. Figure元素
用

首先分享一下我的经验，想做好一件事，必须要花费一些功夫，然后是多学、多思、多练、多交流、多总结，发现自己的问题，然后一定要克服，在状态不好的情况下，往往要及时调整。新手学习前端的话，一定要想想为什么要学习它，是出于一种什么心态，然后定位好自己，多向大牛请教，多教一些没有自己水平高的人，那样往往能让自己成长的快，切勿急躁。初学可以看一些入门视频教程，之后可以买一些书，做一些小项目，要学会投资，分析自己的现状及能力，实时调整，一定要有自己的想法，懂得创新。在这里一定要对自己做分析，然后找出一种适合的学习方法。

在用户注册页面有些需求要求的比较严格，需要对身份证js验证是否合法，通过此功能严格此系统软件，从而过滤到很多水客。下面就此实现方法给大家讲解下。

很多时候我们都是通过一组正则表达式来判断用户输入的身份证是否合法，那在用正则表达式判断之前，你对身份证号的组成有多少了解呢？下面来说说一个身份证号里面包含了多少的信息：

meta基础知识

H5页面窗口自动调整到设备宽度，并禁止用户缩放页面

1

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

border-radius我相信对于老一辈的前端们有着特殊的感情，在经历了没有圆角的蛮荒时代，到如今 CSS3 遍地开花，我们还是很幸福的。

然而即使到了三星大脸流行时代，border-radius在移动端的表现依旧差强人意，主要有以下几点问题：

近期完成了一个新的项目，其中又涉及到了 fixed（固定位置定位）的问题，之前已经阐述过我对 iScroll 的态度，所以在这个项目中我决定不使用 iScroll，使用 position:fixed 实现头部、底部模块定位。在使用fixed的过程中，遇到了一些的问题，并且部分问题无法找到较好的解决方案。下面我就将这些问题一一阐述，提供给大家参考。

翻译文章，原文地址：http://blog.teamtreehouse.com/increase-your-sites-performance-with-hardware-accelerated-css。

HTML5新增了video元素和audio元素，替代了传统HTML4使用复杂的object元素与embed来播放视频或者音频的方法。这次的一个项目，产品经理要求手机加载开始时播放音乐，想到播放音乐，又是在ios和android平台，那audio元素必然是首选。

一、audio的基本知识

audio:标签定义声音，比如音乐或其他音频流。

在ios4+和android2+系统，当手指触摸屏幕a标签链接或按钮时，会产生不同的效果，对于ios点击元素的时候，就会出现一个半透明的灰色背景；对于android则出现红色的边框。对这2个系统自带的效果，这种体验的意义无非为了告知用户按钮已经点击到，带来的价值是好的。可惜带来了体验的同时，也带来了bug……

很多前端工程师在开发手机页面的时候，发现视觉设计师们喜欢用微软雅黑作为中文字体进行设计，于是写页面的时候也定义 font-family 为微软雅黑，后来发到线上后，细心的产品经理发现页面的字体不是微软雅黑，要求马上修改，于是就惊呆了，还跟产品争执一番。实际上手机系统 ios、android 等是不支持微软雅黑字体，为了满足产品的需要，保证视觉稿的还原度，手机端是如何定义微软雅黑字体呢？

兼容IE6、IE7、IE8浏览器，经常会遇到一些问题，可以使用zoom:1来解决，有如下作用：
触发IE浏览器的haslayout
解决ie下的浮动，margin重叠等一些问题。
比如，本站使用DIV做一行两列显示，HTML代码：

1
2
3
4
5
6
7

<div class="h_mainbox">
<h2>推荐文章</h2>
<ul class="mainlist">
<li><a href="#" style="color:#0000FF" target="_blank">CSS库吧</a></li>
<li><a href="#" style="color:#0000FF" target="_blank">原创< /a></li>
</ul>
</div>

js倒计时30秒 激活按钮点击功能，要求用户阅读完条款内容才能激活按钮，要求用户激活短信通道向用户手机发送验证码。

html代码：

1
2
3
4
5
6
7
8
9
10
11
12
13

<div class="demo">
<p>示例一：要求用户阅读完条款内容才能激活按钮</p>
<form action="http://www.npm8.com/" method="post" name="agree">
<input type="submit" class="button" value="请认真查看<服务条款和声明> (30)" id="agree_btn" name="agreeb">
</form>
<br/>
<br/>
<br/>
<p>示例二：要求用户激活短信通道向用户手机发送验证码</p>
<form action="http://www.npm8.com/" method="post" name="myform">
<input type="button" class="button" value="获取手机验证码" id="phone_btn" name="phone" onClick="showtime(30)">
</form>
</div>