• WebUploader在display:none 无法运行


    webuploader.js  多文件上传插件

    当为其所在div设置display:none 时,WebUploader的按钮打不开,无法运行

    解决办法:浏览器加载的时候,设置WebUploader所在的div显示,然后再为起设置隐藏属性

    .tab-content > .tab-pane {
    display: block; position: absolute; opacity: 0; filter:Alpha(opacity=0);
    }
    .tab-content > .active {
    position: relative; opacity: 1; filter:Alpha(opacity=1);
    }


    延伸:
    CSS元素隐藏 
    在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间;有的可以响应点击,有的不能响应点击。
    { display: none; /* 不占据空间,无法点击 */ } 
    /********************************************************************************/ 
    { visibility: hidden; /* 占据空间,无法点击 */ } 
    /********************************************************************************/ 
    { position: absolute; top: -999em; /* 不占据空间,无法点击 */ } 
    /********************************************************************************/ 
    { position: relative; top: -999em; /* 占据空间,无法点击 */ } 
    /********************************************************************************/ 
    { position: absolute; visibility: hidden; /* 不占据空间,无法点击 */ } 
    /********************************************************************************/ 
    { height: 0; overflow: hidden; /* 不占据空间,无法点击 */ } 
    /********************************************************************************/ 
    { opacity: 0; filter:Alpha(opacity=0); /* 占据空间,可以点击 */ } 
    /********************************************************************************/ 
    { position: absolute; opacity: 0; filter:Alpha(opacity=0); /* 不占据空间,可以点击 */ } 
    /********************************************************************************/ 

    zoom: 0.001; 
    -moz-transform: scale(0); 
    -webkit-transform: scale(0); 
    -o-transform: scale(0); 
    transform: scale(0); 
    /* IE6/IE7/IE9不占据空间,IE8/FireFox/Chrome/Opera占据空间。都无法点击 */ 

    /********************************************************************************/ 

    position: absolute; 
    zoom: 0.001; 
    -moz-transform: scale(0); 
    -webkit-transform: scale(0); 
    -o-transform: scale(0); 
    transform: scale(0); 
    /* 不占据空间,无法点击 */ 


  • 相关阅读:
    LeetCode刷题记录(1)
    TypeScript实现设计模式——观察者模式
    TypeScript实现设计模式——策略模式
    TypeScript实现设计模式——工厂模式
    TypeScript实现设计模式——单例模式
    nodejs爬虫--抓取CSDN某用户全部文章
    JavaScript实现常见的数据结构
    利用PicGo、GitHub和jsDelivr搭建图床
    2019年终总结
    Git学习记录(一)
  • 原文地址:https://www.cnblogs.com/miny-simp/p/7072515.html
Copyright © 2020-2023  润新知