/* */ position:absolute;left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);
/* */ position:absolute;left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);
/*
*/
$('input').bind('input propertychange', the_change);
function the_change(){
}
"." -- 代表目前所在的目录,相对路径。 如:<a href="./abc">文本</a> 或 <img src="./abc" />
".." -- 代表上一层目录,相对路径。 如:<a href="../abc">文本</a> 或 <img src="../abc" />
"../../" -- 代表的是上一层目录的上一层目录,相对路径。 如:<img src="../../abc" />
"/" -- 代表根目录,绝对路径。 如:<a href="/abc">文本</a> 或 <img src="/abc" />
"http://localhost/abc/" -- 代表根目录,绝对路径。
2016-5-17 17:13:35-
在浏览器流畅运行的代码,在微信打开竟然卡到爆炸,十分不流畅
即使已经封装好了
(function() {
var lastTime = 0;
var vendors = ['webkit', 'moz'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || // Webkit中此取消方法的名字变了
window[vendors[x] + 'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame) {
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16.7 - (currTime - lastTime));
var id = window.setTimeout(function() {
callback(currTime + timeToCall);
}, timeToCall);
lastTime = currTime + timeToCall;
return id;
};
}
if (!window.cancelAnimationFrame) {
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}
}());
出现该问题的代码,持续找原因ing
/*
*/
$("#start").click(function() {
var start = 0, during = 100;
var _run = function() {
start++;
var the_top = Tween.Quad.easeOut(start, ball.x , -600, during);
$("#ball1").css({"top":the_top});
if(start < during)requestAnimationFrame(_run);
};
_run();
})
/* */ 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.body.offsetWidth (包括边线的宽); 网页可见区域高: document.body.offsetHeight (包括边线的宽); 网页正文全文宽: document.body.scrollWidth 网页正文全文高: document.body.scrollHeight 网页被卷去的高: document.body.scrollTop 网页被卷去的左: document.body.scrollLeft 网页正文部分上: window.screenTop 网页正文部分左: window.screenLeft 屏幕分辨率的高: window.screen.height 屏幕分辨率的宽: window.screen.width 屏幕可用工作区高度: window.screen.availHeight 屏幕可用工作区宽度:window.screen.availWidth alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin alert($(window).width()); //浏览器当前窗口可视区域宽度 alert($(document).width());//浏览器当前窗口文档对象宽度 alert($(document.body).width());//浏览器当前窗口文档body的高度 alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin?
/*
*/
<Directory />
Options FollowSymLinks
AllowOverride All
Order deny,allow
Deny from all
</Directory>
//修改后
<Directory />
Options FollowSymLinks
AllowOverride All
Order deny,allow
Allow from all
</Directory>
/*
*/
# onlineoffline tag - don't remove
Order Deny,Allow
Deny from all
Allow from 127.0.0.1
//修改后
# onlineoffline tag - don't remove
Order Deny,Allow
Deny from none
Allow from all
源自原文:张鑫旭——鑫空间
要实现gif动画的暂停播放效果有很多方法,这里只写出我比较喜欢的一种。
animation模拟gif动画。
原理就是逐帧移动背景,以达到gif的播放效果
gun.jpg如下:
CSS代码部分:
/*
css部分*/
.ball{display:block;
width:40px;
height:40px;
border-radius:80px;
background:url(../images/gun.jpg) center no-repeat ;
background-size:auto 100%;
animation: heart-burst steps(4) 0.4s infinite both;
}
@keyframes heart-burst {
0% {
background-position: 0%;
}
100% {
background-position: 100%;
}
}
HTML代码部分:
/* HTML代码部分*/ <div class="ball " id="ball" style="animation-play-state: paused;"></div> <button type="button">点我开始</button>
js代码部分:
/*
js代码部分*/
$("button").click(function(){
$(".ball").attr("style","");
})
资讯来源:http://blog.fens.me/bootstrap-multilevel-navbar/
此处截取自原文
HTML:
<ul class="nav navbar-nav"> <li class="active"><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Multi Level <b class="caret"></b></a> <ul class="dropdown-menu menu-top"> <li><a href="#">Level 1</a></li> <li class="dropdown-submenu"> <a tabindex="-1" href="#">More options</a> <ul class="dropdown-menu"> <li><a tabindex="-1" href="#">Level 2</a></li> <li class="dropdown-submenu"> <a href="#">More..</a> <ul class="dropdown-menu"> <li><a href="#">Level3</a></li> </ul> </li> </ul> </li> </ul> </li> </ul>
CSS:
.dropdown:hover .menu-top {
display: block;
}
.dropdown-submenu{
position:relative;
}
.dropdown-submenu > .dropdown-menu{
top:0;
left:100%;
margin-top:-6px;
margin-left:-1px;
-webkit-border-radius:0 6px 6px 6px;
-moz-border-radius:0 6px 6px 6px;
border-radius:0 6px 6px 6px;
}
.dropdown-submenu:hover > .dropdown-menu{
display:block;
}
.dropdown-submenu > a:after{
display:block;
content:" ";
float:right;
width:0;
height:0;
border-color:transparent;
border-style:solid;
border-width:5px 0 5px 5px;
border-left-color:#666;
margin-top:5px;
margin-right:-10px;
}
.dropdown-submenu:hover > a:after{
border-left-color:#ffffff;
}
.dropdown-submenu .pull-left{
float:none;
}
.dropdown-submenu.pull-left > .dropdown-menu{
left:-100%;
margin-left:10px;
-webkit-border-radius:6px 0 6px 6px;
-moz-border-radius:6px 0 6px 6px;
border-radius:6px 0 6px 6px;
}
完整代码github:https://github.com/bsspirit/angular-navbar,同学可以根据需要自行下载。
关于原作者

/* */ typeof(abc) != "undefined"
/*
防吞*/
/*===========================================in_array 小函数*/
function in_array(search,array){
for(var i in array){
if(array[i]==search){
return true;
}
}
return false;
}
/*调用*/
in_array(11,arr)