随笔分类 - javascript
摘要：含羞默默一张一合效果实验版，现在有多方面各种问题，会继续美化，敬请期待。。。<!DOCTYPE html><html> <head> <title>含羞默默一张一合效果</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="http://files.cnblogs.com/kuik
阅读全文
摘要：旋转的地球实现原理：外层的轮廓是球形，里层包含一张世界地图背景，按照一定的时间匀速运动。一、画轮廓支持css3属性border-radius可以其属性，制作球形。ie6-ie8采用蒙版效果。mask样式中将background设置一张中间为圆形全透明的png8图片。采用ie识别hack，*包括（ie6，ie7），\0包括（ie8）。备注：因为上传到博客园中相册中的图片会被修改，所以在ie上看到的效果不对。可以将代码拷贝到本机上并制作一张相同的png8遮罩图片即可，此时运行便能看到效果。遮罩效果的焦点图css遮罩#content{width: 300px; height: 300px; bord
阅读全文
摘要：通过按钮和上下左右键控制div中的属性向左移2像素 ← 按下时向左移10像素向右移2像素 → 按下时向右移10像素向上移2像素 ↑ 按下时向上移10像素向下移2像素 ↓ 按下时向下移10像素放大 ctrl + ↑ 系数为1.01扩大 缩小 ctrl + ↓ 系数为0.99减小快速使图片位于红色方框内确定计算图片在红色边框内的坐标位置<!DOCTYPE html><html> <head> <title></title> <meta http-equiv="Content-Type" content="
阅读全文
摘要：已经不是第一次写焦点图了。但是每一次写都有不同进步和完善。这次带来了遮罩效果的焦点图。设计思想：采用绝对定位，关于mask是设置遮罩层，这个图层位于最上面，关于pic是焦点图片。控制width，height，margin-left，margin-top，z-index属性，便可以实现漂亮的遮罩效果。焦点图简单的手风琴效果下面演示最原始的效果：<!DOCTYPE html><html> <head> <title></title> <meta http-equiv="Content-Type" content=
阅读全文
摘要：自动序列编号和自动属性编号，效果图如下：实现原理：添加和删除是逆向过程，实现是一致的。增加时，向父容器中增加元素append方法，并将所有的自定义属性编号和序列编号设置为空，然后通过$.each方法，重新为自定义属性编号和序列编号赋值。$.each(items, function (k, v) { $(this).attr("opt", "mopt" + k); serials.eq(k).html(k);});删除时，为所有删除按钮绑定事件live方法，将元素从父容器中删除detach方法，并将所有的自定义属性编号和序列编号设置为空，然后通过$.eac
阅读全文
摘要：模拟抽奖的实现过程旋转原理：当支持CSS3属性采用transform: rotate（角度deg）设置,当角度为正数时顺时针旋转，当为负数时逆时针旋转。如果是IE8及其以下，采用采用绝对定位设置top和left，模拟角度旋转。run方法，参数angle指角度 function run(angle) { if (isIE) { cosDeg = Math.cos(angle * Math.PI / 180); sinDeg = Math.sin...
阅读全文
摘要：雪花那个飘“雪花”相对父容器绝对定位，向父容器中增加一片片“雪花”。创建“雪花”，document.createElement("span"),为“雪花”增加css样式，设定初始值top和left。top设为相对父元素-parseInt(spanY + Math.random() * 20)，即偏移顶部多少的一个小范围值。left相对父元素parseInt(Math.random() * 900)，即随即在900这个范围内取值。N指雪花的数pId指父容器eSpan指“雪花”并为雪花设置样式 this.N = N; this.pId =...
阅读全文
摘要：碰撞检测：1、圆形与矩形的碰撞检测函数ComputeCollision，当相对距离小于圆形半径的时候为碰撞。 参数介绍(w：矩形的宽，h：矩形的高，r：圆形半径，rx：圆形中心与矩形中心相对坐标X，ry：圆形中心与矩形中心相对坐标Y） function ComputeCollision(w, h, r, rx, ry) { var dx = Math.min(rx, w * 0.5); var dx1 = Math.max(dx, -w * 0.5); var dy = Math.min(ry, h * 0.5)...
阅读全文
摘要：格式化将0-9变成00-09的显示方式function forNum(num) { if (num < 10) return "0" + num; else return num;}countdown函数计算时间差返回数组形式，数组的第一个返回字符串，第二个返回布尔值判断是否结束参数：d1是服务器端传过来的秒形式d2是时间的字符串function countdown(d1, d2) { var endTime = new Date(d2).getTime() / 1000; var d = endTime - d1; var se...
阅读全文
摘要：【程序12】程序12 题目：企业发放的奖金根据利润提成。利润(I)低于或等于10万元时，奖金可提10%；利润高于10万元，低于20万 元时，低于10万元的部分按10%提成，高于10万元的部分，可可提成7.5%；20万到40万之间时，高于20万元的部 分，可提成5%；40万到60万之间时高于40万元的部分，可提成3%；60万到100万之间时，高于60万元的部分，可 提成1.5%，高于100万元时，超过100万元的部分按1%提成，从键盘输入当月利润I，求应发放奖金总数？ 1.程序分析：请利用数轴来分界，定位。注意定义时需把奖金定义成长整型。 1 var reward = 0; 2 ...
阅读全文
摘要：【程序11】 题目：有1、2、3、4个数字，能组成多少个互不相同且无重复数字的三位数？都是多少？ 1 function Permuta() { 2 var count = 0; 3 var str = ""; 4 for (var i = 1; i < 5; i++) { 5 for (var j = 1; j < 5; j++) { 6 for (var k = 1; k < 5; k++) { 7 ...
阅读全文
摘要：【程序10】 题目：一球从100米高度自由落下，每次落地后反跳回原高度的一半；再落下，求它在第10次落地时，共经过多少米？第10次反弹多高？方法一：1 function mHeight(num, count) {2 var tmp = 0;3 for (var i = 0; i < count; i++) {4 num = num / 2;5 tmp += num;6 }7 return { "height": num,...
阅读全文
摘要：【程序9】 题目：一个数如果恰好等于它的因子之和，这个数就称为"完数"。例如6=1＋2＋3.编程找出1000以内的所有完数。 1 function addFactor1(num) { 2 var sum = 0; 3 var tmp = ""; 4 for (var i = 0; i <= num; i++) { 5 sum = 0; 6 var arr = new Array(i); 7 for (var j ...
阅读全文
摘要：【程序8】题目：求s=a+aa+aaa+aaaa+aa...a的值，其中a是一个数字。1 function sumNum(num, count) {2 var tmp = 0;3 for (var i = count; i > 0; i--) {4 tmp += num * Math.pow(10, Math.abs(i - count)) * i;5 }6 return tmp;7 }
阅读全文
摘要：1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>提示框</title> 5 <style type="text/css"> 6 #pop{width: 400px;border: 1px solid #666;margin: 100px auto 0px;border-radius: 8px;} 7 #pop .title{height: 40px;line-height: 40px;overflow: hidden;border-bottom: 1px sol
阅读全文
摘要：【程序6】 题目：输入两个正整数m和n，求其最大公约数和最小公倍数。 function M(num1, num2) { var temp; var a; var b; if (num1 < num2) { temp = num1; num1 = num2; num2 = temp; } a = num1; b = num2; while (b != 0) { temp = a % b; a = b; b = temp; } return { "min": a, "max": num1 * num2 / a }; }最小公倍数：M.(12,8).ma
阅读全文
摘要：【程序5】 题目：利用条件运算符的嵌套来完成此题：学习成绩>=90分的同学用A表示，60-89分之间的用B表示，60分以下的用C表示。 1.程序分析：(a>b)?a:b这是条件运算符的基本例子。方法一： function test1(num) { return (num >= 90) ? "A" : (num >= 60) ? "B" : "C"; }方法二： function test2(num) { if (num >= 90) { return "A"; } else if (n
阅读全文
摘要：【程序4】 题目：将一个正整数分解质因数。例如：输入90,打印出90=2*3*3*5。 程序分析：对n进行分解质因数，应先找到一个最小的质数k，然后按下述步骤完成： (1)如果这个质数恰等于n，则说明分解质因数的过程已经结束，打印出即可。 (2)如果n<>k，但n能被k整除，则应打印出k的值，并用n除以k的商,作为新的正整数你n,重复执行第一步。 (3)如果n不能被k整除，则用k+1作为k的值,重复执行第一步。方法一： function intFactor(num) { var i = 2; while (num >= i) { if (num === i) { docume
阅读全文
摘要：【程序3】题目：打印出所有的"水仙花数"，所谓"水仙花数"是指一个三位数，其各位数字立方和等于该数本身。例如：153是一个"水仙花数"，因为153=1的三次方＋5的三次方＋3的三次方。1.程序分析：利用for循环控制100-999个数，每个数分解出个位，十位，百位。 答： var i, j, k, a; for (a = 100; a <= 999; a++) { i = parseInt(a / 100); j = parseInt(a / 10 - i * 10); k = a % 10; if (a === i * i *
阅读全文
摘要：【程序2】题目：判断101-200之间有多少个素数，并输出所有素数。1.程序分析：判断素数的方法：用一个数分别去除2到sqrt(这个数)，如果能被整除，则表明此数不是素数，反之是素数。 方法一： function primeInterval(start, end) { for (var i = start; i <= end; i++) { var flag = true; for (var j = 2; j <= Math.sqrt(i); j++) { if (i % j === 0) { flag = false; break; } } if (flag == true) {
阅读全文