首页 > 其他分享 >原生上传文件按钮样式优化

原生上传文件按钮样式优化

时间:2023-08-10 15:00:11浏览次数:37  
标签:原生 pre 100% upload 按钮 btn 上传 change

//解决思路,原生上传文件按钮设置成完全透明,然后定位放大到需要的按钮上,让他全覆盖上去
//这是用了kindeditor后生成的新控件,所以直接找.upload-input1

<a href="" class="pre_btn pre_btn_change">更换照片<input class="upload-input upload-input1" type="file" id="uploadify" capture="camera" /></a>


.pre_btn_change {
    position:relative;
}
    .pre_btn_change .upload-input1 {
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }
    .pre_btn_change input.ke-upload-file {
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }

  

标签:原生,pre,100%,upload,按钮,btn,上传,change
From: https://www.cnblogs.com/SmallChen/p/17620343.html

相关文章

  • c#.net 大文件分片上传处理
    ​ IE的自带下载功能中没有断点续传功能,要实现断点续传功能,需要用到HTTP协议中鲜为人知的几个响应头和请求头。 一. 两个必要响应头Accept-Ranges、ETag        客户端每次提交下载请求时,服务端都要添加这两个响应头,以保证客户端和服务端将此下载识别为可以断点续......
  • 【HarmonyOS】@ohos.request 上传下载的那些事儿
    【关键字】@ohos.request、上传下载【写在前面】在进行HarmonyOS应用开发时,可能需要进行上传或下载文件功能开发,本文章主要进行上传下载相关功能介绍和一些注意事项及FAQ。【上传开发步骤】步骤1:上传下载接口需要申请ohos.permission.INTERNET权限,如下:"reqPermissions":[{......
  • 【HarmonyOS】@ohos.request 上传下载的那些事儿
    【关键字】@ohos.request、上传下载【写在前面】在进行HarmonyOS应用开发时,可能需要进行上传或下载文件功能开发,本文章主要进行上传下载相关功能介绍和一些注意事项及FAQ。【上传开发步骤】步骤1:上传下载接口需要申请ohos.permission.INTERNET权限,如下:"reqPermissions":[{......
  • 【OSS】使用java-sdk上传文件失败,报错InvalidBucketName,BucketName是文件名
    【OSS】使用java-sdk上传文件失败,报错InvalidBucketName,BucketName是文件名背景:aliyun-sdk-ossV2.8.3排查过程:使用javasdk报错invalidbucketname,查看bucketname字段被设置为了文件名问题原因当前java-sdk版本是v2.8.3,需要更新版本。初始化client时关闭cnameco......
  • Android仿微信图片上传,可以选择多张图片,缩放预览,拍照上传等
    仿照微信,朋友圈分享图片功能。可以进行图片的多张选择,拍照添加图片,以及进行图片的预览,预览时可以进行缩放,并且可以删除选中状态的图片。很不错的源码,大家有需要可以下载看看。微信微信微信微信下载地址: 微信上传图片源码很多网友不知道怎么获取图片路径,这里贴出......
  • .NET和Azure:构建云原生应用程序
    在现代软件开发中,云原生应用程序已经成为一种越来越受欢迎的架构风格。它们可以在云环境中实现高度可伸缩性、弹性和灵活性,同时充分利用云服务的优势。在本篇博客中,我们将探讨如何使用.NET技术和Azure云平台来构建云原生应用程序。我们将以一个简单的示例应用程序为例,演示如何将.NE......
  • 云原生架构实战:构建可弹性扩展的企业级应用
    云原生架构实战:构建可弹性扩展的企业级应用一、微服务架构与SpringCloud概述随着云计算和容器技术的普及,传统的单体应用架构逐渐暴露出扩展性、部署和维护等方面的瓶颈。微服务架构应运而生,将应用拆分成一组小型服务,每个服务都运行在自己的进程中,通过HTTP或消息中间件等通信机制......
  • HCS651关于OBS上传vmdk镜像失败问题处理过程
    报错现象:镜像转换失败处理过程1、登录CPT-SRV-01和02节点,排查/var/log/imcs/taskmgr/ims/下日志taskmgr_ims_executor.log报错信息,如没有日志,则逐个重启sysadmin进程;kill-9****(sysadmin的uid)2、修改/opt/imcs/tomcat/taskmgr/WEB-INF/classes/taskmgr-config.properties......
  • 前端shp文件写到本地时,原生的shp-write存在的不能写入多条数据及中文乱码问题
    shp-write·Doraemon22333/前端-码云-开源中国(gitee.com)参考(1)https://github.com/hwbllmnn/shp-write/tree/maintenance(2)https://blog.csdn.net/qq_37748236/article/details/131804606......
  • 安防视频监控平台EasyNVR页面无法上传授权文件,该如何进行授权?
    TSINGSEE青犀视频安防监控平台EasyNVR可支持设备通过RTSP/Onvif协议接入,并能对接入的视频流进行处理与多端分发,包括RTSP、RTMP、HTTP-FLV、WS-FLV、HLS、WebRTC等多种格式。在智慧安防等视频监控场景中,EasyNVR可提供视频实时监控直播、云端录像、云存储、录像检索与回看、告警等视......