Blazor中使用impress.js

impress.js是什么?

你想在浏览器中做PPT吗?比如在做某些类似于PPT自动翻页,局部放大之类,炫酷无比。

在Blazor中,几经尝试,用以下方法可以实现。写文不易,请点赞、收藏、关注,并在转载请注明出处和作者:

1、在启动页中静态引用javascript 

...
<body>
<script src="_framework/blazor.server.js" asp-append-version="true"></script>
<script type="text/javascript" src="lib/impress.js/impress.js"></script>
</body>
</html>

注意,是在body的最后来引用,在<script src="_framework/blazor.server.js" asp-append-version="true"></script>之后。

2、创建一个javascript函数来初始化。

var impressA = null;function startPPT() {impressA = impress();impressA.init();
}

3、在OnAfterRenderAsync(bool firstRender)中调用

protected override async Task OnAfterRenderAsync(bool firstRender)
{if (firstRender){await _jsRuntime.InvokeVoidAsync("startPPT");await InvokeAsync(() => StateHasChanged());}
}

impress.js的具体用法在这里:

https://github.com/impress

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

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

相关文章

Python基础知识:整理9 文件的相关操作

1 文件的打开 # open() 函数打开文件 # open(name, mode, encoding) """name: 文件名&#xff08;可以包含文件所在的具体路径&#xff09;mode: 文件打开模式encoding: 可选参数&#xff0c;表示读取文件的编码格式 """ 2 文件的读取 文…

web缓存代理

缓存代理的概述 wed代理的工作机制 缓存网页对象&#xff0c;减少重复请求 web缓存代理作用 1.存储一些之前被访问的&#xff0c;且可能将要被再次访问的静态网络资源对象&#xff0c;使用户可以直接从缓存代理服务器获取资源&#xff0c;从而减少上游原始服务器的负载压力…

分享7款前端CSS动画特效源码(附在线演示)

精选7款前端CSS动画特效源码 下面我会给出特效样式图或演示效果图 但你也可以点击在线预览查看源码的最终展示效果及下载源码资源 CSS飞行的荷包蛋 CSS荷包蛋动画 荷包蛋会向右前方加速飞行 期间还能看到周围的气流匆匆飞过 以下图片只是简单的模型没有具体的动画效果最终动画…

IPv6路由协议---IPv6动态路由(OSPFv3-5)

OSPFv3各链路状态通告类型 4.Inter-Area-Router-LSA区域间路由器(4类LSA) 边界路由器(ABR)产生的第4类LSA,在Area 范围内泛洪,描述了到本AS内其他区域的ASBR路由器信息; 每各Inter-Area-Router-LSA包含一个ASBR路由器信息,LSA中的能力选项(Options)与所描述的ASBR …

满足ITOM需求的网络监控工具

IT 运营管理&#xff08;ITOM&#xff09;可以定义为监督 IT 基础架构的各种物理和虚拟组件的过程;确保其性能、运行状况和可用性;并使它们能够与基础架构的其他组件无缝协作。IT 运营管理&#xff08;ITOM&#xff09;在大型 IT 管理模型中也发挥着积极作用&#xff0c;包括 I…

强化学习求解TSP(四):Qlearning求解旅行商问题TSP(提供Python代码)

一、Qlearning简介 Q-learning是一种强化学习算法&#xff0c;用于解决基于奖励的决策问题。它是一种无模型的学习方法&#xff0c;通过与环境的交互来学习最优策略。Q-learning的核心思想是通过学习一个Q值函数来指导决策&#xff0c;该函数表示在给定状态下采取某个动作所获…

vue配置qiankun及打包上线

项目结构 基座&#xff1a;vue3 子应用A&#xff1a;vue3 子应用B&#xff1a; react 子应用C&#xff1a;vue3vite 项目目录&#xff1a; 配置基座 首先下载qiankun yarn add qiankun # 或者 npm i qiankun -S 所有子应用也要安装&#xff0c;vue-vite项目安装 cnpm ins…

蓝桥杯练习题(三)

&#x1f4d1;前言 本文主要是【算法】——蓝桥杯练习题&#xff08;三&#xff09;的文章&#xff0c;如果有什么需要改进的地方还请大佬指出⛺️ &#x1f3ac;作者简介&#xff1a;大家好&#xff0c;我是听风与他&#x1f947; ☁️博客首页&#xff1a;CSDN主页听风与他 …

[C#]winform部署PaddleOCRV3推理模型

【官方框架地址】 https://github.com/PaddlePaddle/PaddleOCR.git 【算法介绍】 PaddleOCR是由百度公司推出的一款开源光学字符识别&#xff08;OCR&#xff09;工具&#xff0c;它基于深度学习框架PaddlePaddle开发。这款工具提供了一整套端到端的文字检测和识别解决方案&a…

PyQt5零基础入门(二)——QLabel控件

前言 QLabel控件可以视为是一个标签项&#xff0c;具有显示文本、图像的作用。在本篇文章中将介绍QLabel控件的常见用法。 例子 显示文本 import sys from PyQt5.QtWidgets import *if __name__ "__main__":app QApplication([])label QLabel(Hello world!)la…

Zookeeper 和 naocs的区别

Nacos 和 ZooKeeper 都是服务发现和配置管理的工具&#xff0c;它们的主要区别如下&#xff1a;功能特性&#xff1a;Nacos 比 ZooKeeper 更加强大&#xff0c;Nacos 支持服务发现、动态配置、流量管理、服务治理、分布式事务等功能&#xff0c;而 ZooKeeper 主要用于分布式协调…

【天龙怀旧服】攻略day4

关键字&#xff1a; 快捷鉴定手工、组队跟随兔子、九州店铺 1】快捷鉴定手工 可以把鉴定符拖到快捷技能栏&#xff0c;例如f1然后鼠标选到未鉴定手工&#xff0c;快捷键即可鉴定 2】组队跟打手&#xff0c;兔子队 队长给小号&#xff0c;组队跟随&#xff1b; 打手退跟随打…

UM2004 一款低功耗、高性能、即插即用型 OOK 射频接收器芯片

UM2004 是一款低功耗、高性能、即插即用型 OOK 射频接收器&#xff0c;该芯片具有 2.5V ~ 5.5V 较宽的输入电压范围&#xff0c;灵敏度高达到-109dBm&#xff0c;工作频段为 300MHz ~ 480MHz&#xff0c;支持 1Kbps~ 5Kbps 的数据率传输。采用 SOP8 封装类型&#xff0c;应用时…

容器扫描Trivy及Trivy-db数据库研究

trivy介绍 Trivy是一个镜像容器扫描工具&#xff0c;用于扫描漏洞和配置错误。 它是一款相当全面且多功能的安全扫描器&#xff0c;支持多种扫描目标&#xff0c;能够弥补市面上常见Web 漏洞扫描工具的不足。 Trivy 可以轻松地通过安装并将二进制文件添加到项目中&#xff0c;…

Edge浏览器设置自动刷新详细步骤分享

Edge浏览器自动刷新设置方法详细教学分享。在电脑上访问一些动态网页的时候&#xff0c;用户发现网页的内容滚动之后&#xff0c;内容无法进行刷新。这个情况是我们的浏览器没有开启自动刷新功能。那么这个功能设置怎么开启呢&#xff1f;一起来看看以下的操作方法教学吧。 操…

AI 在医学中的三个关键作用;联想 AI PC 全阵容亮相 CES 2024

近日&#xff0c;在接受 Northwestern 采访时&#xff0c;著名心脏病学教授 Sanjiv Shah 谈及了 AI 和医学结合所带来的三个关键作用。 Sanjiv Shah 说道&#xff1a;「首先是诊断。有许多疾病&#xff0c;无论是常见的还是罕见的&#xff0c;都容易被误诊或漏诊。AI 可以提醒临…

Farad capacitor法拉电容优点及缺点

Farad capacitor 法拉电容又称Electrical Double-Layer Capacitor双电层电容器、Gold capacitor黄金电容、Super capacitor 超级电容器&#xff0c;是一种化学元件。Super capacitor 超级电容器通过极化电解质来储能&#xff0c;但不发生化学反应&#xff0c;而且储能过程是可逆…

如何在 Windows10 下运行 Tensorflow 的目标检测?

看过很多博主通过 Object Detection 实现了一些皮卡丘捕捉&#xff0c;二维码检测等诸多特定项的目标检测。而我跟着他们的案例来运行的时候&#xff0c;不是 Tensorflow 版本冲突&#xff0c;就是缺少什么包&#xff0c;还有是运行官方 object_detection_tutorial 不展示图片等…

golang学习-指针

1、定义 指针也是一个变量&#xff0c;但它是一个特殊的变量&#xff0c;它存储的是另一个变量的内存地址。是引用数据类型。 取一个变量的地址&#xff1a;&a 定义&#xff1a; var p *int &a 可以理解为 指针变量p中存储的是a的内存地址&#xff0c;但是变量p也…

leaflet学习笔记-贝塞尔曲线绘制(八)

前言 两点之间的连线是很常见的&#xff0c;但是都是直直的一条线段&#xff0c;为了使连线更加平滑&#xff0c;我们可以使用曲线进行连线&#xff0c;本功能考虑使用贝塞尔曲线进行连线绘制&#xff0c;最后将线段的两端节点连接&#xff0c;返回一个polygon。 贝塞尔简介 …