odometer |
|
|
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="http://github.hubspot.com/odometer/themes/odometer-theme-default.css" />
<style type="text/css">
.odometer {
font-size: 40px;
}
</style>
</head>
<body>
<div id="odometer" class="odometer">123</div>
<script src="http://github.hubspot.com/odometer/odometer.js"></script>
<script type="text/javascript">
setInterval(function(){
odometer.innerHTML = (new Date()).getTime()%100*3;
}, 1000);
</script>
</body>
</html>
|
Steps navigator bar |
|
|
<!DOCTYPE html>
<html>
<head>
<title>Steps nav bar</title>
<style type="text/css">
*{
box-sizing: border-box;
margin: 0;
padding: 0;
}
.container{
width: 960px;
text-align: center;
clear: both;
margin: 30px;
}
.step{
width: 25%;
float: left;
border-right: solid 1px #fff;
}
.step:last-child{
border-right: none;
}
.rectangle{
position: relative;
width: 100%;
height: 50px;
border: solid 15px #fff;
border-left: none;
border-right: none;
background: #999;
}
.circle{
position: absolute;
width: 50px;
height: 50px;
line-height: 50px;
border-radius: 25px;
margin: 0 auto;
background: #999;
color: #fff;
font-weight: bolder;
font-size: 36px;
left: 95px;
top: -15px;
}
.active .rectangle, .active .circle{
background: blue;
}
</style>
</head>
<body>
<div class="container">
<div class="step">
<div class="rectangle">
<div class="circle">1</div>
</div>
<label>First</label>
</div>
<div class="step active">
<div class="rectangle">
<div class="circle">2</div>
</div>
<label>Second</label>
</div>
<div class="step">
<div class="rectangle">
<div class="circle">3</div>
</div>
<label>Third</label>
</div>
<div class="step">
<div class="rectangle">
<div class="circle">4</div>
</div>
<label>Fourth</label>
</div>
</div>
</body>
</html>
|
css traingle |
|
|
<!DOCTYPE html>
<html>
<head>
<title>css Traingle</title>
<style type="text/css">
.traingle, .traingle:after{
width: 0;
height: 0;
border-top: 28px solid transparent;
border-bottom: 28px solid transparent;
}
.left{
position: relative;
border-right: 38px solid #2e332f;
}
.right{
position: relative;
border-left: 38px solid #2e332f;
}
.left:hover{
border-right-color: #f4ba37;
-webkit-transition: border-right-color .5s linear;
}
.right:hover{
border-left-color: #f4ba37;
-webkit-transition: border-left-color .5s linear;
}
.left:after{
position: absolute;
right: -38px;
top: -28px;
content: "";
border-right: 10px solid white;
z-index: 2;
}
.right:after{
position: absolute;
left: -38px;
top: -28px;
content: "";
border-left: 10px solid white;
z-index: 2;
}
</style>
</head>
<body>
<div class="traingle left"></div>
<div class="traingle right"></div>
</body>
</html>
|
function |
|
|
b();// b
a();// undefined is not a function
var a= function(){
console.log("a");
};
function b(){
console.log("b");
}
|
Global eval |
|
|
var geval = eval; // Using another name does a global eval
var x = "global", y = "global"; // Two global variables
function f() { // This function does a local eval
var x = "local"; // Define a local variable
eval("x += 'changed';"); // Direct eval sets local variable
return x; // Return changed local variable
}
function g() { // This function does a global eval
var y = "local"; // A local variable
geval("y += 'changed';"); // Indirect eval sets global variable
return y; // Return unchanged local variable
}
console.log(f(), x); // Local variable changed: prints "localchanged global":
console.log(g(), y); // Global variable changed: prints "local globalchanged":
|
wrapper objects |
|
|
var s = "test"; // string
s.len = 4; // refer to property of string, js calls as if new String(s) to create a new object. Once the property has been resolved, the new object is discarded
console.log(s.len); // undefined
var s= new String("test'); // String Object
s.len = 4;
console.log(s.len); // 4
|
Capture command exec output string |
|
|
import java.io.ByteArrayOutputStream;
import org.apache.commons.exec.CommandLine;
import org.apache.commons.exec.DefaultExecutor;
import org.apache.commons.exec.Executor;
import org.apache.commons.exec.PumpStreamHandler;
public String execToString(String command) throws Exception {
ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
CommandLine commandline = CommandLine.parse(command);
DefaultExecutor exec = new DefaultExecutor();
PumpStreamHandler streamHandler = new PumpStreamHandler(outputStream);
exec.setStreamHandler(streamHandler);
exec.execute(commandline);
return(outputStream.toString());
}
|