ASP.NET-FineUI开发实践-4(二)

本文分享了在网页中实现窗口弹出及关闭动画的方法。通过修改default.js与ext-part2.js文件,作者实现了自定义的显示与隐藏动画效果,并提供了具体的代码实现。

在网上找了找,实验了一下window弹出和关闭的动画效果分享一下。

接上次的代码

default.js 

      
    window_tips.animCollapse= true;//打开动画效果

    window_tips.animateTarget = Ext.getBody();//开始的定位,就是以哪定位,是个el,=按钮 也行

  

ext-part2.js

f_showTips: function里加上 window_tips.on('beforehide', this.f_hideTips);//注册关闭前事件

      //显示提醒窗体;
     //iframeUrl窗体的url,目前未考虑传'';
     //windowTitle窗体的title,目前未考虑传'';
     //txthtml窗体显示的数据
     //width窗体的宽,目前未考虑传'';
     //height窗体的高,目前未考虑传'';
     f_showTips: function (iframeUrl, windowTitle,txthtml, width, height) {

        if (typeof (iframeUrl) === 'undefined') {
            iframeUrl = this.f_iframe_url;
        }
        if (typeof (windowTitle) === 'undefined') {
            windowTitle = this.title;
        }

            window.label_html=txthtml;//显示数据存到全局参数里

            window.label_html_num=0;//第一次打开重置查看到第几条
            this.f_showtips_label(label_html);//显示方法,传入数据
            
             this.on('beforehide', this.f_hideTips);//注册关闭前事件
            //this.on('beforeshow', this.f_beforshowTips);
            windowTitle="消息提醒"+"   "+(label_html_num+1)+"/"+txthtml.length;//拼写标题

            //原show方法
            F.wnd.show(this, iframeUrl, windowTitle, this.f_property_left, this.f_property_top, this.f_property_position, this.id + '_Hidden', width, height);

        },

  

 

f_hideTips: function () {

            var self = this;

            if (self.hidden) { return false; }//隐藏就不执行

            $("#window_tips_wrapper .x-ie-shadow").css("display","none");//阴影写死了

            $("#window_tips_wrapper .x-shim").css("display","none");//写死了

            self.el.slideOut('r',{ duration: 1000});//动画 r 是右的意思,后面的是时间
            self.hidden=true;//隐藏属性

            return false; //不执行默认的hide

        },

 

转载于:https://www.cnblogs.com/shiworkyue/p/4020697.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值