PHP+javascript模拟Matrix画面

直接存为*.php文件运行即可。

<?
  $color_back="#000000";
  $number_w=8;
  $number_h=6;
  $space=1;
  $font_size=20;
  $speed=0;
?>
<html>
<head>
<title>The Matrix</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<script language="javascript">
// *****************************************************************
//                   Written By Caocao
//                   caocao@eastday.com
//                   http://caocao.oso.com.cn
// *****************************************************************
number_h=<? echo $number_h;?>;
number_w=<? echo $number_w;?>;
step=5;
text=new Array("A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z");
grad=new Array("#000000","#004000","#008000","#00C000","#00FF00");

function line()
{
  this.start=100;
  this.end=60;
  this.restart=0;
}

function randchar()
{
  return (text[Math.round(Math.random()*25)]);
}

function initial()
{
  matrix=new Array();
  light=new Array();
  for (i=0;i<number_h;i++)
  {
    for (j=0;j<number_w;j++)
    {
      matrix[i*number_h+j]="<? echo $color_back;?>";
    }
  }
  for (j=0;j<number_w;j++)
  {
    light[j]=new line();
  }
}

function new_light()
{
  for (j=0;j<number_w;j++)
  {
    if (light[j].restart==0)
    {
      light[j].start=0;
      light[j].end=-10-Math.round(Math.random()*20);
      light[j].restart=light[j].end-Math.round(Math.random()*20);
    }
    else
    {
      light[j].start++;
      light[j].end++;
      light[j].restart++;
    }
  }
}

function new_color(i,j)
{
  if ((light[j].start-i)<5&&(light[j].start-i)>0)
  {
    return (light[j].start-i);
  }
  if ((i-light[j].end)<5&&(i-light[j].end)>0)
  {
    return (i-light[j].end);
  }
  if ((i-light[j].end)>4&&(light[j].start-i)>4)
  {
    return (4);
  }
  return (0);
}

function display()
{
  for (i=0;i<number_h;i++)
  {
    for (j=0;j<number_w;j++)
    {
      eval("w"+i+"h"+j).innerHTML="<font color="+grad[new_color(i,j)]+">"+randchar()+"</font>";
    }
  }
}

function show()
{
  new_light();
  display();
  setTimeout("show()",<? echo $speed;?>);
}
</script>
<style type="text/css">
<!--
<?
  echo ".size,tr,td {  font-size: ".$font_size."pt; line-height: ".$font_size."pt ;color:#00FF00}n";
?>
-->
</style>
</head>

<?
  echo "<body bgcolor=".$color_back.">";

echo "<table width=".($number_w*$font_size)." border=0 cellspacing=".$space." cellpadding=0>";
  for ($i=0;$i<$number_h;$i++)
  {
    echo "<tr>";
    for ($j=0;$j<$number_w;$j++)
    {
      echo "<td id=w".$i."h".$j.">M</td>";
    }
    echo "</tr>";
  }
  echo "</table>";
?>

<script language="javascript">
  initial();
  show();
</script>
</body>
</html>

(0)

相关推荐

  • Android中使用Matrix控制图形变换和制作倒影效果的方法

    最近在使用Matrix进行绘图的操作.对Matrix的一些方法有了一些更深的体会,记下来,以便日后复习. Matrix常用的方法: 一.变换方法: Matrix提供了translate(平移).rotate(旋转).scale(缩放).skew(倾斜)四种操作,这四种操作的内部实现过程都是通过matrix.setValues(-)来设置矩阵的值来达到变换图片的效果. Matrix的每种操作都有set.pre.post三种操作,set是清空队列再添加,pre是在队列最前面插入,post是在队列最后

  • Android变形(Transform)之Matrix用法

    引言 最近在研究Android的变形,Android的2D变形(包括缩放,扭曲,平移,旋转等)可以通过Matrix来实现,3D变形可以通过Camera来实现.接下来就将我这俩天研究的东西和大家分享下,先来看看Matrix的用法. 效果图 变形以后 Matrix矩阵 坐标变换矩阵,即一个3*3的矩阵,用来对图形进行坐标变换. 图1.1  A为坐标矩阵,C为原始矩阵,R是A和C矩阵相乘记过,那么可以知道:(矩阵知识,大学没学好的伤不起啊) x' = a*x + b*y + c y' = d*x +

  • 深入理解Android Matrix理论与使用的详解

    以前在线性代数中学习了矩阵,对矩阵的基本运算有一些了解,前段时间在使用GDI+的时候再次学习如何使用矩阵来变化图像,看了之后在这里总结说明.首先大家看看下面这个3 x 3的矩阵,这个矩阵被分割成4部分.为什么分割成4部分,在后面详细说明. 首先给大家举个简单的例子:现设点P0(x0, y0)进行平移后,移到P(x,y),其中x方向的平移量为△x,y方向的平移量为△y,那么,点P(x,y)的坐标为:x = x0  + △x y = y0  + △y采用矩阵表达上述如下:  上述也类似与图像的平移,

  • Android中Matrix用法实例分析

    本文实例讲述了Android中Matrix用法.分享给大家供大家参考,具体如下: Matrix ,中文里叫矩阵,高等数学里有介绍,在图像处理方面,主要是用于平面的缩放.平移.旋转等操作. 首先介绍一下矩阵运算.加法和减法就不用说了,对应位相加就好.图像处理,主要用到的是乘法 .下面是一个乘法的公式: 在 Android 里面, Matrix 由 9 个 float 值构成,是一个 3*3 的矩阵.如下图: 解释一下,上面的sinX 和cosX ,表示旋转角度的cos 值和sin值,注意,旋转角度

  • 如何利用matrix实现图片倒影效果

    本文主要内容就是用marix加上渐变色实现图片倒影的效果,步骤如下: 1. 获取需要倒影效果的图片,这里取原图片的一半 2. 添加颜色渐变到倒影图片上 具体的实现如下面代码所述,我们以一种自定义view的形式给出效果图,代码如下: package com.flection.view; import com.flection.main.R; import android.annotation.SuppressLint; import android.content.Context; import

  • C#使用Matrix执行缩放的方法

    本文实例讲述了C#使用Matrix执行缩放的方法.分享给大家供大家参考.具体实现方法如下: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Text; using System.Windows.Forms; using System.Drawing.Drawing2D; namespa

  • Android中利用matrix 控制图片的旋转、缩放、移动

    本文主要讲解利用android中Matrix控制图形的旋转缩放移动,具体参见一下代码: 复制代码 代码如下: /**  * 使用矩阵控制图片移动.缩放.旋转  */  public class CommonImgEffectView extends View { private Context context ;      private Bitmap mainBmp , controlBmp ;      private int mainBmpWidth , mainBmpHeight , c

  • 如何使用Matrix对bitmap的旋转与镜像水平垂直翻转

    Bitmap convert(Bitmap a, int width, int height){int w = a.getWidth();int h = a.getHeight();Bitmap newb = Bitmap.createBitmap(ww, wh, Config.ARGB_8888);// 创建一个新的和SRC长度宽度一样的位图Canvas cv = new Canvas(newb);Matrix m = new Matrix();m.postScale(1, -1);   //

  • PHP+javascript模拟Matrix画面

    直接存为*.php文件运行即可. <?   $color_back="#000000";   $number_w=8;   $number_h=6;   $space=1;   $font_size=20;   $speed=0; ?> <html> <head> <title>The Matrix</title> <meta http-equiv="Content-Type" content=&qu

  • 详解CSS故障艺术

    概述 本文的主题是 Glitch Art,故障艺术. 什么是故障艺术?我们熟知的抖音的 LOGO 正是故障艺术其中一种表现形式.它有一种魔幻的感觉,看起来具有闪烁.震动的效果,很吸引人眼球. 故障艺术它模拟了画面信号出现故障导致成像错误的感觉.青色色块与红色色块无法重合就是这种故障的体现.从胶片时代开始到今天的数码时代,这种故障一直是观众非常熟悉的现象.即使抖音的 LOGO 只是静态的,大脑也会自己补完整个效果,甚至还会自己脑补信号干扰的噪音. 使用混合模式实现抖音 LOGO 首先从静态的开始,

  • Android使用Matrix旋转图片模拟碟片加载过程

    今天实现了一个模拟碟片加载过程的小demo,在此展示一下.由于在公司,不好截取动态图片,因此就在这截取两张静态图片看看效果先. 下面简单的将代码列出来. setp1.准备两张用于旋转的图片,如下:loading_disc.png是第一张图片,loading_light.png是第二张图片.      step2.自定义一个View,用来控制这两个图片的旋转.com.oyp.loadingdisk.LoadingDiscView.java package com.oyp.loadingdisk;

  • android模拟实现航拍遥控

    本文实例为大家分享了android模拟实现航拍遥控的具体代码,供大家参考,具体内容如下 由于最近做一个航拍项目,手机端模拟遥控,控制无人机,之前在网上这方面的知识比较少,所有就贴出来demo供大家参考,废话少说,先贴图 左右两个点,在圈内活动,一个是控制油门,一个是控制方向,放手后会返回中心点,这些在游戏场景中经常看到,比如射击类的游戏,这里自定义view,继承ImageView,难点就在手指控制这部分,以下是源码. package com.remotecontrol; import andro

  • Flex 画面快照截图及显示实现代码

    一.对指定画面进行快照.截图. 在Flex SDK中flash.display包下面有两个类Bitmap和BitmapData.在flex中可以通过两个类对图片进行操作.BitmapData类中有一个draw方法这个方法的第一个参数是进行画面截图的源对象,这个对象必须实现IBitmapDrawable接口.而DisplayObject类实现了这个接口,DisplayObject是所有可见控件的先祖类,也就意味着所有在flex可以看到的画面.控件都可以用draw方法来进行快照截图. 具体的代码如下

  • JS+CSS3模拟溢出滚动效果

    移动开发的时候,我们经常会遇到滑动事件,众所周知手机端滑动主要依靠touch事件.最近接连遇到两个页面都有类似overflow:auto的效果,一般情况下通过css设置是可以实现的(虽说丑了点儿),,但是一旦overflow:auto的元素响应touch事件时就会有诸多不便,例如fullpage中某一元素自滑动,我们可以通过normalScrollElements来使元素滑动的时候不滑动到下一屏,但是在元素滑动到最底部的时候也就不能响应下一屏事件,上滑也是一样,这时候就需要touch事件来响应,

  • Win2003播放画面粗糙的解决策略

    Windows 2003操作系统在其性能和资源管理方面都比Windows 2000.Windows XP强大得多,但是装好Windows 2003和显卡驱动程序之后,在播放电影.MTV等时,分辨率较低,画面较粗糙,字体带锯齿,其效果还不如Windows 2000和Windows XP,检查显卡和驱动程序也是完好的.那么是不是就断言Windows 2003在播放电影.MTV等时就不如Windows 2000和Windows XP呢?其实不然,如果理解分辨率的含义,搞清楚Windows 2003中D

  • Java编程实现的模拟行星运动示例

    本文实例讲述了Java编程实现的模拟行星运动.分享给大家供大家参考,具体如下: 期待了很久的Java语言程序设计也拉下了帷幕,在几个月的时间里基本掌握了java的简单用法,学习了java的主要基础知识,面向对象思想,多线程并发控制,swing界面设计,动画制作等,最后结课了也打算制作一个课程设计能够尽可能多的涵盖所学知识,将其进行串联,因此考虑实现了一个简单的模拟行星运动的小软件,主要思路如下: 利用动画实现行星运动的模拟,主面板里有一个中心行星,同时绘制了椭圆轨道,有一颗运动的行星围绕着中心行

  • 利用Python模拟谷歌的小恐龙游戏

    目录 前言 开发工具 环境搭建 先睹为快 代码介绍 前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,如有问题请及时联系我们以作处理. PS:如有需要Python学习资料的小伙伴可以加点击下方链接自行获取 谷歌流量器中有个很有名的彩蛋:当你网络出现问题时,就会出现一个"小恐龙游戏". (如果想要直接进行游戏,可以在地址栏输入:chrome://dino) 今天我们就来给大家演示下,用Python来自己做一个仿制的"小恐龙游戏"! 废话不多说,

  • 如何利用Ruby简单模拟Lambda演算详解

    前言 最近看一本叫做<计算的本质>的书,这本书主要说了一些底层计算方面的知识.可以说它刷新了我的三观,而当今天看到可以使用Y组合子来实现递归的时候我的世界观基本崩塌了.故借着七夕来写一篇文章总结一些关于计算的一些基本认识.以便后续可以更好地学习.也借着Ruby的语法来阐述一下关于Lambda的一些故事. 0. 题外话 为了庆祝一下这个七夕节日,我提前关掉了LOL,打开了Emacs,敲下如下代码(这里顺便推广一下Ruby的单件方法) subject = "情侣" object

随机推荐