stevenjin 2024-07-13 21:10 采纳率: 97.3%
浏览 3
已结题

ASP.NET CORE mvc加一个遮盖层防止操作

1.环境ASP.NET CORE mvc
2.在提交完成之前，想用最简单有效果的方法在整个网站加一个遮盖层

  • 写回答

6条回答 默认 最新

  • 码农阿豪@新空间代码工作室 Java领域优质创作者 2024-07-13 21:10
    关注
    让阿豪来帮你解答，本回答参考chatgpt3.5编写提供，如果还有疑问可以评论或留言
    为了在整个网站加上一个遮盖层，可以使用CSS和JavaScript来实现。在ASP.NET CORE MVC环境下，可以通过在布局视图中添加相应的代码来实现。 下面是一个简单的示例：
    1. 在_Layout.cshtml文件中添加以下代码：
    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewData["Title"] - My ASP.NET Core Application</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" />
    <!-- 添加遮盖层的样式 -->
    <style>
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 9999;
            display: none; /* 默认隐藏 */
        }
    </style>
</head>
<body>
    <div class="overlay"></div>
    
    <div class="navbar navbar-expand-lg navbar-light bg-light">
        <a class="navbar-brand" href="#">Navbar</a>
    </div>
    
    <main role="main" class="container">
        @RenderBody()
    </main>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script>
        $(function () {
            // 显示遮盖层
            $(".overlay").show();
        });
    </script>
</body>
</html>
    1. 在对应的视图文件中，可以自定义内容：
    @{
    ViewData["Title"] = "Home Page";
}
<h1>Hello, world!</h1>

    在上面的代码中，我们在_Layout.cshtml中添加了一个名为.overlay的div元素，并设置其样式为遮盖整个页面。在页面加载完毕时，通过jQuery代码将遮盖层显示出来。 当用户访问网站时，会首先看到一个遮盖层，等待页面内容加载完成后再消失。这样就实现了在整个网站加上一个遮盖层的效果。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(5条)

报告相同问题？

问题事件

  • 系统已结题 9月12日
  • 已采纳回答 9月4日
  • 创建了问题 7月13日

悬赏问题

  • ¥15 网络分析设施点无法识别
  • ¥15 状态图的并发态问题咨询
  • ¥15 PFC3D,plot
  • ¥15 VAE模型编程报错无法解决
  • ¥100 基于SVM的信息粒化时序回归预测，有偿求解！
  • ¥15 物体组批优化问题-数学建模求解答
  • ¥15 微信原生小程序tabBar编译报错
  • ¥350 麦克风声源定位坐标不准
  • ¥15 apifox与swagger使用
  • ¥15 egg异步请求返回404的问题