v形 加强版
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<style>
#div1{position:relative;}
#div1 div{width:50px;height:50px;background:blue;color:#fff;font-size:20px;text-align:center;line-height:50px;position:absolute;}
</style>
<script>
window.onload = function()
{
var oTxt = document.getElementById('txt1');
var oBtn = document.getElementById('btn1');
var oDiv = document.getElementById('div1');
oBtn.onclick = function()
{
//0 0*50
//1 1*50
//2 2*50
//3 1*50
//4 0*50
//( oTxt.value + 2 );//从页面当中获取的任何数据都是一个字符串类型的 string
//alert( typeof 222 );
//
oDiv.innerHTML = '';
var num = parseInt( oTxt.value );
if( num%2==0 )
{
alert( '请输入一个奇数' );
}
else
{
for( var i=0;i<num;i++ )
{
if( i<(num-1)/2 )
{
oDiv.innerHTML +='<div style="left:'+(i*50)+'px;top:'+(i*50)+'px;">'+i+'</div>';
}
else
{
oDiv.innerHTML +='<div style="left:'+(i*50)+'px;top:'+((num-1-i)*50)+'px;">'+i+'</div>';
};
};
};
};
};
</script>
<body>
<input type="text" value="" id="txt1"> <input type="button" id="btn1" value="按钮">
<div id="div1">
</div>
</body>
</html>
最新文章
- .Net程序员之Python基础教程学习----字符串的使用 [Second Day]
- 使用IOS7原生API进行二维码条形码的扫描
- 在unity5中减少Draw Calls(SetPass Calls)[转]
- July 11th, Week 29th Monday, 2016
- Java&;MySQL Type Mapping
- ASP.NET Identity 系列笔记目录
- [ Android 五种数据存储方式之三 ] —— SQLite存储数据
- 201521123074 《Java程序设计》第10周学习总结
- 深入java虚拟机学习 -- 内存管理机制
- 第三节:框架前期准备篇之利用Newtonsoft.Json改造MVC默认的JsonResult
- layui select配合input实现动态模糊搜索
- javaMail实现收发邮件(二)
- jzoj4229
- html5 canvas路径绘制2
- Arraylist静态初始化
- Think in Java(二):初始化与清理
- HTML-利用CSS和JavaScript制作一个切换图片的网页
- Selenium 入门到精通系列:六
- java运行环境(JRE)
- .net开发CAD2008无法调试的解决方法