zoukankan      html  css  js  c++  java
  • cookie多次点赞效果

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
    *{
    margin: 0;
    padding: 0;
    }
    #box{
    position: absolute;
    top: 100px;
    left: 300px;
    }
    #box a{
    font-size: 30px;
    font-family: "微软雅黑";
    color: #ccc;
    text-decoration: none;
    }
    #box span{
    top: -22px;
    left: 0;
    color: red;
    font-size: 20px;
    font-family: "微软雅黑";
    position: absolute;
    }
    #box #click{
    height: 40px;
    30px;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    }



    </style>
    </head>
    <body>
    <div id="box">
    <a>赞</a>
    <div id="click"></div>

    </div>
    <script src="js/cookie.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/move.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
    function Zan(){
    this.oBox=document.getElementById("box");
    this.oA=document.getElementsByTagName('a');
    this.oClick=document.getElementById("click");
    this.num=0;
    this.oSpan=null;
    }
    Zan.prototype.click=function(){
    var This=this;
    this.oClick.onclick=function(){
    This.num=This.getcookie('name');
    This.num++;
    This.oSpan=document.createElement('span');
    This.oSpan.innerHTML='+'+This.num;
    This.oBox.appendChild(This.oSpan);
    This.oSpan.move({'opacity':0,'top':-30},300,function(){
    This.oBox.removeChild(this);
    });
    this.setcookie('name',This.num,10);
    }
    }
    var zan=new Zan();
    zan.click();
    </script>
    </body>
    </html>

    move.js

    Object.prototype.move = function( mJson , time , cv , fn ){
    if ( typeof cv == 'undefined' )
    {
    time = time || 400;
    cv = 'linear';
    }
    if ( typeof time == 'string' )
    {
    fn = cv;
    cv = time;
    time = 400;
    }else if ( typeof time == 'number' && typeof cv == 'function' )
    {
    fn = cv;
    cv = 'linear';
    }else if ( typeof time == 'function' )
    {
    fn = time;
    time = 400;
    cv = 'linear';
    }
    var This = this;
    var iB = {};
    var startTime = (new Date()).getTime();
    for ( var attr in mJson )
    {
    if( attr == 'opacity' ){
    iB[attr] = parseInt( this.getStyle(this , attr)*100 );
    }else{
    iB[attr] = parseInt( this.getStyle(this , attr) );
    }

    };
    clearInterval( this.timer );
    this.timer = setInterval(function(){
    var nowTime = (new Date()).getTime();
    var it = nowTime - startTime;
    if( it >= time ){
    it = time;
    }
    for ( var attr in mJson )
    {
    var value = Tween[cv]( it , iB[attr] , parseInt( mJson[attr] ) - iB[attr] , time );
    if(attr == 'opacity'){
    This.style.filter = 'alpha( opacity='+value+' )';
    This.style.opacity = value / 100;
    }else{
    This.style[attr] = value + 'px';
    }

    }
    if ( it == time )
    {
    clearInterval( This.timer );
    fn && fn.call(This);
    }
    },13);
    var Tween = {
    linear: function (t, b, c, d){ //匀速
    return c*t/d + b;
    },
    easeIn: function(t, b, c, d){ //加速曲线
    return c*(t/=d)*t + b;
    },
    easeOut: function(t, b, c, d){ //减速曲线
    return -c *(t/=d)*(t-2) + b;
    },
    easeBoth: function(t, b, c, d){ //加速减速曲线
    if ((t/=d/2) < 1) {
    return c/2*t*t + b;
    }
    return -c/2 * ((--t)*(t-2) - 1) + b;
    },
    easeInStrong: function(t, b, c, d){ //加加速曲线
    return c*(t/=d)*t*t*t + b;
    },
    easeOutStrong: function(t, b, c, d){ //减减速曲线
    return -c * ((t=t/d-1)*t*t*t - 1) + b;
    },
    easeBothStrong: function(t, b, c, d){ //加加速减减速曲线
    if ((t/=d/2) < 1) {
    return c/2*t*t*t*t + b;
    }
    return -c/2 * ((t-=2)*t*t*t - 2) + b;
    },
    elasticIn: function(t, b, c, d, a, p){ //正弦衰减曲线(弹动渐入)
    if (t === 0) {
    return b;
    }
    if ( (t /= d) == 1 ) {
    return b+c;
    }
    if (!p) {
    p=d*0.3;
    }
    if (!a || a < Math.abs(c)) {
    a = c;
    var s = p/4;
    } else {
    var s = p/(2*Math.PI) * Math.asin (c/a);
    }
    return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
    },
    elasticOut: function(t, b, c, d, a, p){ //正弦增强曲线(弹动渐出)
    if (t === 0) {
    return b;
    }
    if ( (t /= d) == 1 ) {
    return b+c;
    }
    if (!p) {
    p=d*0.3;
    }
    if (!a || a < Math.abs(c)) {
    a = c;
    var s = p / 4;
    } else {
    var s = p/(2*Math.PI) * Math.asin (c/a);
    }
    return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
    },
    elasticBoth: function(t, b, c, d, a, p){
    if (t === 0) {
    return b;
    }
    if ( (t /= d/2) == 2 ) {
    return b+c;
    }
    if (!p) {
    p = d*(0.3*1.5);
    }
    if ( !a || a < Math.abs(c) ) {
    a = c;
    var s = p/4;
    }
    else {
    var s = p/(2*Math.PI) * Math.asin (c/a);
    }
    if (t < 1) {
    return - 0.5*(a*Math.pow(2,10*(t-=1)) *
    Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
    }
    return a*Math.pow(2,-10*(t-=1)) *
    Math.sin( (t*d-s)*(2*Math.PI)/p )*0.5 + c + b;
    },
    backIn: function(t, b, c, d, s){ //回退加速(回退渐入)
    if (typeof s == 'undefined') {
    s = 1.70158;
    }
    return c*(t/=d)*t*((s+1)*t - s) + b;
    },
    backOut: function(t, b, c, d, s){
    if (typeof s == 'undefined') {
    s = 3.70158; //回缩的距离
    }
    return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
    },
    backBoth: function(t, b, c, d, s){
    if (typeof s == 'undefined') {
    s = 1.70158;
    }
    if ((t /= d/2 ) < 1) {
    return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
    }
    return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
    },
    bounceIn: function(t, b, c, d){ //弹球减振(弹球渐出)
    return c - Tween['bounceOut'](d-t, 0, c, d) + b;
    },
    bounceOut: function(t, b, c, d){
    if ((t/=d) < (1/2.75)) {
    return c*(7.5625*t*t) + b;
    } else if (t < (2/2.75)) {
    return c*(7.5625*(t-=(1.5/2.75))*t + 0.75) + b;
    } else if (t < (2.5/2.75)) {
    return c*(7.5625*(t-=(2.25/2.75))*t + 0.9375) + b;
    }
    return c*(7.5625*(t-=(2.625/2.75))*t + 0.984375) + b;
    },
    bounceBoth: function(t, b, c, d){
    if (t < d/2) {
    return Tween['bounceIn'](t*2, 0, c, d) * 0.5 + b;
    }
    return Tween['bounceOut'](t*2-d, 0, c, d) * 0.5 + c*0.5 + b;
    }
    }
    };
    Object.prototype.getStyle = function( obj , attr ){
    return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];
    };

  • 相关阅读:
    C 语言编程经典 100 例
    visual studio.net已检测到指定的web服务器运行的不是asp.net1.1版。无法运行asp.net web应用程序
    如何编译及运行java
    VBScript 函数集
    SQL SERVER定时作业的设置方法
    显示桌面按钮不小心被删,有什么办法找回?
    随机抽取n个记录的SQL
    打开项目时提示如下错误:Visual Studio .NET 无法创建应用程序 。问题很可能是因为本地 Web 服务器上没有安装所需的组件
    简单的数据库连接
    ASP中各种数据库连接代码
  • 原文地址:https://www.cnblogs.com/sunny123-/p/5987306.html
Copyright © 2011-2022 走看看