提示用微信浏览器打开_浏览器如何设置消息提醒

提示用微信浏览器打开_浏览器如何设置消息提醒概述大体思路是这样的:先建一个蒙版,蒙版放上提示的信息,然后写一个js,在页面打开的时候判断是不是用微信自带的浏览器打开的,如果是就打开蒙版,提示用浏览器打开基本页面添加蒙版添加js最终效果

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

概述

大体思路是这样的:先建一个蒙版,蒙版放上提示的信息,然后写一个js,在页面打开的时候判断是不是用微信自带的浏览器打开的,如果是就打开蒙版,提示用浏览器打开

基本页面

<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title>APP下载</title>
		<style type="text/css">
			td {
				line-height: 50px;
				font-size: 40px;
			}       
		</style>
	</head>

	<body style="background-color: #4DFFFF;padding-top: 400px">
		<div align="center" style="width: 100%;">
			<table>
				<tr>
					<td valign="middle">
						<a href="community.apk" id="JdownApp">安卓下载</a>
					</td>
				</tr>
				<tr>
					<td valign="middle">
						<a href="community.ipa" id="JdownApp2" class="btn-warn">苹果下载</a>
					</td>
				</tr>
			</table>
			
		</div>
	</body>
</html>

添加蒙版

<!--引入遮蔽层-->
<div id="Mask" style="">

</div>
//蒙版样式
#Mask {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    background-image: url(img/tweixinip.jpg);
    background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 1000;
}
.model-content {
    width: 100%;
    height: 100%;
    text-align: center;
    background: #ffffff;
    border-radius: 6px;
    margin: 100px auto;
    line-height: 30px;
    z-index: 10001;
}

添加js

<script type="text/javascript">
    //判断是否在微信中打开
    var ua = navigator.userAgent;
    var isWeixin =  !!/MicroMessenger/i.test(ua);
	
	//如果使用的是微信自带浏览器,就打开蒙版
    if(isWeixin) {
        var SHOW = 0;
        document.getElementById('Mask').style.display = ++SHOW % 2 == 1 ? 'block' : 'none';
    }

</script>

最终效果

当使用浏览器打开时展示原始页面

提示用微信浏览器打开_浏览器如何设置消息提醒

当使用微信打开时展示蒙版

提示用微信浏览器打开_浏览器如何设置消息提醒

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/170835.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 只有搞Java开发的才知道!java软件工程师培训教程pdf

    只有搞Java开发的才知道!java软件工程师培训教程pdf前言又到一年金九银十之际。Java作为目前用户最多,使用范围最广的软件开发技术之一。Java的技术体系主要由支撑Java程序运行的虚拟机,提供各开发领域接口支持的Java,Java编程语言及许多第三方Jvav框架构成。其中,以Java的虚拟器为今天的着重点以下是我整理收藏的一些JVM大厂面试经典问题与相应答案,希望可以给看文的朋友一些帮助由于篇幅过长,请耐心往下看,文末提供小编收藏已久的JVM面试宝典!一、不少培训班候选人的简历中,缺乏足够的商业项目年限不少同学会有这样得感受:投出去不少

  • WPF中的布局方式

    WPF中的布局方式前言:WPF(WindowsPresentationFoundation)是微软推出的基于Windows的用户界面框架,属于.NETFramework3.0的一部分。它提供了统一的编程模型、语言和框架,真正做到了分离界面设计人员与开发人员的工作;同时它提供了全新的多媒体交互用户图形界面布局方式:1.Canvas2.Grid3.WarpPanel4.StackPanel5.ScrollViewer……

  • window安装maven配置环境变量[通俗易懂]

    window安装maven配置环境变量[通俗易懂]首先去maven官网下载,点击这里去下载页面,下拉选择下图点击下载下载好之后解压出来,然后配置环境变量,在我的电脑-右键-属性-高级系统设置-环境变量然后在系统变量下点击新建变量名:M2_HOME变量值:你下载的maven解压出来的路径,我的如下,复制路径粘贴到变量值里,点击确定再找到系统变量里的:Path在变量值里加入:%M2_HOME%/bin不要…

  • linux防火墙端口开放_防火墙开启端口linux

    linux防火墙端口开放_防火墙开启端口linux在服务器上使用某些软件时需要开启相应的防火墙端口号,简单了解下Linux防火墙端口防火墙策略防火墙策略可以基于流量的源目地址、端口号、协议、应用等信息来定制,然后防火墙使用预先定制的策略规则监控出入的流量,若流量与某一条策略规则相匹配,则执行相应的处理,否则则丢弃。起到一个过滤的作用,保证了主机的安全。查看firewall服务状态systemctlstatusfirewalld开启、重启、关闭、firewalld.service服务1.开启servicefirewalldstart

  • manage.py作用_java源码解析

    manage.py作用_java源码解析源码目录结构ApiResponse这个类没啥好说的classApiResponse(Response):"""继承了requests模块中的Response类

  • vs2021安装教程_vs2015企业版安装教程

    vs2021安装教程_vs2015企业版安装教程一、学习C/C++语言用什么环境?DevC++很久不在更新,对于C语言的标准支持不够好vc6.0太古老,98年的软件了二、那小编推荐什么大家用什么软件?VS2013及以上版本都行!今天跟大家唠如何安装VS2022(听说VS官网更新了,小伙伴们找不到VS2019了)三、VS2019下载官网VS2022官网https://visualstudio.microsoft.com/zh-hans/?rr=https://www.microsoft.com/zh-cn/3.1点击VS

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号