日期:2014-05-16  浏览次数:20419 次

腾讯的 JET框架怎么样?
适合用来做前台页面还是后台的管理页面?使用过的来说点吧!

------解决方案--------------------
已经更名为 JX,看那特效,主要是服务于前端的

项目主页: http://alloyteam.github.com/JX/

例子:

HTML code

<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8" />
<title>Jx About</title> 
<meta http-equiv="imagetoolbar" content="no"> 
<style type="text/css"> 
    html { 
        overflow: hidden; 
        width: 100%; 
        height: 100%; 
    } 
    body { 
        background: -webkit-gradient(linear, 0 0, 0 900, from(#025695), to(#ADD1E3)) repeat scroll 0 0 transparent;
        background: -moz-linear-gradient(center top, #025695, #ADD1E3) repeat scroll 0 0 transparent;
        background: -o-linear-gradient(top, #025695, #ADD1E3);
        filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#025695',endColorStr='#ADD1E3',gradientType='0');
        width: 100%; 
        height: 100%; 
        color: #fff; 
        margin: 0;
        padding: 0;
    } 
    .full {
        
        width: 100%; 
        height: 100%; 
    }
    #frm { 
        position: absolute; 
        width: 100%; 
        height: 100%; 
        left: 5%; 
        top: 60px; 
        font-size: 2em; 
        font-weight: bold; 
        font-family: verdana, arial; 
        overflow: hidden; 
        padding: 0.5em; 
    } 
    #frm span { 
        position: relative; 
        text-align: center; 
        z-index: 1; 
    } 
    #mtxform { 
        position: relative; 
        z-index: 10; 
    } 
    .hidden { 
        visibility: hidden; 
    } 
    h1 {
        font-size: 2.5em; 
        font-weight: bold; 
        font-family: verdana, arial; 
        color: #fff;
        border-bottom: 1px solid #eee;
        width: 90%;
        line-height: 1.8;
        margin: 0 auto;
    }
</style> 
 
<script type="text/javascript"> 
var mtx = function () { 
    /* ==== private variables & methods ==== */ 
    var stop = false; 
    var frm, lineDelay, charDelay; 
    var colorText, colorMatch, colorGhost, elapsedTime; 
    var lineIndex = 0; 
    var lineChar  = []; 
    var animStack = []; 
    var colorStack = []; 
    /* ==== rgb color ==== */ 
    function colorRGB (c) { 
        return 'rgb(' 
            +Math.round(Math.min(255, Math.max(0, c[0])))+',' 
            +Math.round(Math.min(255, Math.max(0, c[1])))+',' 
            +Math.round(Math.min(255, Math.max(0, c[2])))+')'; 
    } 
    /* ==== Easing functions ==== */ 
    function Ease () {} 
    Ease.prototype = { 
        ease : function () { 
            this.m += this.s; 
            this.x0 += (this.d * this.m * .0025); 
            if (this.m == 20) this.s = -1; 
            return this.x0; 
        }, 
        init : function (x0, x1) { 
            this.m = 0; 
            this.s = 1; 
            this.d = x1 - x0; 
            this.x0 = x0; 
        } 
    } 
 
    /* ==== Load Lines ==== */ 
    function loadLines () { 
        // read text from HTML form 
        text = document.forms.mtxform.text.value.split("\n"); 
        // loop through all lines 
        for (var j = 0; j < text.length; j++) { 
            var t = text[j]; 
            if (t) { 
                var n = t.length; 
                lineChar[j] = []; 
                // first pass: create characters capture RELATIVE offset coordinates 
                for (var i = 0; i < n; i++) 
                    lineChar[j][i] = new Character(t.charAt(i), j); 
                // second pass: convert to absolute position 
                for (var i = 0, o; o = lineChar[j][i]; i++) { 
                    if (o.c == "|") { 
                        // remove spaces 
                        lineChar[j].splice(i, 1); 
                        frm.removeChild(o.o); 
                        i--; 
                    } else {