Vue自定义成功弹窗H5实现类似于小程序的效果

news2024/10/7 2:24:11
 效果图:

<div class="father">
    
      <div class="success-box" v-if="isSuccess">
            <img src="../../assets/insure/success-logo.png" alt="">
            <span>{
  { successTitle }}</span>
        </div>
</div>
    .father{
     position: relative;
    }
    .success-box {
        width: 130px;
        height: 130px;
        border-radius: 8px;
        background: rgba(64, 64, 64, 0.88);
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        gap: 21px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -65px;
        margin-top: -65px;
        color: #FFF;
        text-align: center;
        

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1411924.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

单片机之keil软件环境搭建

简介 Keil提供了包括C编译器、宏汇编、链接器、库管理和一个功能强大的仿真调试器等在内的完整开发方案&#xff0c;通过一个集成开发环境&#xff08;μVision&#xff09;将这些部分组合在一起。     目前软件对中文的支持不友好&#xff0c;不建议安装网上的一些汉化包…

14.java集合

文章目录 概念Collection 接口概念示例 Iterator 迭代器基本操作&#xff1a;并发修改异常增强循环遍历数组&#xff1a;遍历集合&#xff1a;遍历字符串&#xff1a;限制 list接口ListIteratorArrayList创建 ArrayList&#xff1a;添加元素&#xff1a;获取元素&#xff1a;修…

瑞丽杂志引领潮流,VOSS眼镜概念店开启奢华新纪元

近日&#xff0c;由《瑞丽》杂志社举办的2023第4届瑞丽轻奢品牌大赛&#xff0c;以“轻奢•悦藏”为主题的大赛已圆满结束&#xff0c;VOSS眼镜荣获&#xff1a;2023瑞丽轻奢品牌大赛「轻奢时尚风格奖」&#xff0c;作为眼镜行业唯一获此奖项的品牌&#xff0c;VOSS眼镜对此表示…

仓储管理系统——软件工程报告(详细设计)④

详细设计 一、系统功能模块的划分 根据系统的功能性需求&#xff0c;本文将部队仓库管理系统分为以下六大模块&#xff1a;系统管理模 块、基础数据模块、出入库管理模块、库存管理模块、仓库信息管理模块、作业管理模 块&#xff0c;每个模块内部又分为很多小功能模块&#…

java数据结构与算法刷题-----LeetCode769. 最多能完成排序的块

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 解题思路 这道题可以理解为&#xff0c;只能保证块内有序的情况下&#xf…

力扣 | 141. 环形链表

快慢指针的使用&#xff01; import java.util.HashSet; import java.util.Set;public class _141_linked_list_cycle {// 哈希查找// 时间复杂度&#xff1a;O(n)// 空间复杂度&#xff1a;O(n)public boolean hasCycle1(ListNode head) {Set<ListNode> set new HashSe…

2-SAT问题相关理论和算法

前言 SAT 问题简介 SAT是可满足性、适定性(Satisfiability)问题的简称。一般形式为k-适定性问题或k-可满足性问题&#xff0c;简称 k-SAT。 何为布尔可满足性问题&#xff1f;给定一条真值表达式&#xff0c;包含逻辑变量、逻辑与、逻辑或以及非运算符&#xff0c;如&#x…

uniapp app更新

uniapp app更新 这个版本要随之增加&#xff0c;不然刚更新时直接用app, 新包增加的那些页面跳转会有问题&#xff0c;不能跳新的页面 //app更新检测 updataApp(){const that this;uni.showLoading({title:加载中...})plus.runtime.getProperty(plus.runtime.appid, functio…

JS进阶-高阶技巧

深浅拷贝 首先浅拷贝和深拷贝只针对引用类型 • 浅拷贝 开发中我们经常需要复制一个对象。如果直接用赋值会有下面问题&#xff1a; 这好比有同学来pink老师这里拷视频&#xff0c;竟然用的是剪切…气人不 浅拷贝&#xff1a;拷贝的是地址 1. 拷贝对象&#xff1a;Object…

塑料透光率测定仪评估塑料质量

塑料透光率是指光线通过塑料材料的能力&#xff0c;是评估塑料质量的重要指标之一。透光率越高&#xff0c;塑料的质量通常越好。为了确保生产出的塑料制品具有良好的透光性&#xff0c;对塑料透光率的检测非常重要。 一、塑料透光率检测方法 塑料透光率检测通常采用两种方法…

苹果Find My市场需求火爆,伦茨科技ST17H6x芯片助力客户量产

苹果发布AirTag发布以来&#xff0c;大家都更加注重物品的防丢&#xff0c;苹果的 Find My 就可以查找 iPhone、Mac、AirPods、Apple Watch&#xff0c;如今的Find My已经不单单可以查找苹果的设备&#xff0c;随着第三方设备的加入&#xff0c;将丰富Find My Network的版图。产…

攻防世界WEB新手训练区

view_source 此题我愿称之为网安领域的hello world 查看网页源代码的方式一般有—— 右键->查看网页源代码F12->源代码/来源Ctrlu 随后可以再代码第17行处找到flag&#xff0c;至此迈入网安第一步。可喜可贺&#xff0c;可喜可贺... get_post 考察http的两种请求方式&…

Cesium数据加载

文章目录 0.引言1.影像加载1.1Bing地图1.2天地图1.3ArcGIS在线地图1.4高德地图1.5OSM影像1.6MapBox影像 2.OGC地图服务2.1WMS2.2WMTS2.3TMS 3.GeoJSON数据加载4.KML数据加载5.TIFF数据加载6.点云数据加载7.地形数据加载7.1在线地形数据加载7.2本地地形数据加载 8.倾斜摄影模型数…

Influxdb系列(一)influxdb2.7.x的部署安装

一、influxdb的介绍 InfluxDB 是一种时序数据库&#xff0c;时序数据库通常被用在监控场景&#xff0c;比如运维和 IOT&#xff08;物联网&#xff09;领域。这类数据库旨在存储时序数据并实时处理它们。 比如。我们可以写一个程序将服务器上 CPU 的使用情况每隔 10 秒钟向 In…

基于springboot+vue旅游网站

摘要 旅游网站的开发是一个综合性的项目&#xff0c;涉及到前端和后端的技术&#xff0c;而基于Spring Boot和Vue.js的组合是一种常见的选择&#xff0c;因为它们可以很好地配合&#xff0c;提供高效且现代化的开发体验。首先&#xff0c;我们使用Spring Boot作为后端框架。Spr…

《WebKit技术内幕》学习之十五(2):Web前端的未来

2 嵌入式应用模式 2.1 嵌入式模式 读者可能会奇怪本章重点表达的是Web应用和Web运行平台&#xff0c;为什么会介绍嵌入式模式&#xff08;Embedded Mode&#xff09;呢&#xff1f;这是因为很多Web运行平台是基于嵌入式模式的接口开发出来的&#xff0c;所以这里先解释一下什…

3ds Max宣传片怎么提升渲染速度?从硬件升级到云渲染,全面提升你的渲染速度!

在3ds Max中&#xff0c;渲染是一项耗时的任务&#xff0c;尤其是对于大型场景和复杂的动画。然而&#xff0c;通过一些优化策略和技巧&#xff0c;你可以显著加速渲染过程。以下是一些建议和技巧&#xff0c;帮助你提高3ds Max的渲染速度&#xff1a; 1.升级硬件&#xff1a; …

Caused by: com.mongodb.MongoTimeoutException: Timed out after 30000 ms

报错 Caused by: com.mongodb.MongoTimeoutException: Timed out after 30000 ms while waiting to connect. Client view of cluster state is {typeUNKNOWN, servers[{addressmangodb-m.cc.com:3717, typeUNKNOWN, stateCONNECTING, exception{com.mongodb.MongoSocketReadE…

H.264与H.265的主要差异

H.265仍然采用混合编解码&#xff0c;编解码结构域H.264基本一致&#xff0c; H.265与H.264的主要不同 编码块划分结构&#xff1a;采用CU (CodingUnit)、PU(PredictionUnit)和TU(TransformUnit)的递归结构。 并行工具&#xff1a;增加了Tile以及WPP等并行工具集以提高编码速…

梦百合2024经销商大会:优结构、强终端、提质量,深化同频与赋能

2024年1月24日-25日,以“优结构强终端提质量”为主题的梦百合2024年经销商大会在江苏如皋圆满召开,汇聚来自全国各地的400余名经销商代表,总结回顾了梦百合2023年发展成果,描绘2024年发展蓝图,表彰优秀经销商,加强品牌与经销伙伴的同频共振,为2024年的携手共进开好头、起好步。…