Javascript 函数 openFullscreen() ,如何让它在页面上的多个 iframe 上工作
在页面上我有一个 iframe,src 中有 *.pdf 文件。 <p>在页面上我有一个 iframe,src 中有 *.pdf 文件。</p> <pre><code><div class="node--view-mode-full"> <p><iframe allow="fullscreen" allowfullscreen="" frameborder="0" height="980" scrolling="no" src="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" width="660"></iframe></p> <p><iframe allow="fullscreen" allowfullscreen="" frameborder="0" height="980" scrolling="no" src="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" width="660"></iframe></p> </div> </code></pre> <p>浏览器中内置的 pdf 查看器现在不支持 iframe 中的全屏模式。</p> <p>我找到了解决方案<a href="https://www.w3schools.com/howto/howto_js_fullscreen.asp" rel="nofollow noreferrer">https://www.w3schools.com/howto/howto_js_fullscreen.asp</a>,解决了问题 - 以全屏模式打开 iframe。在 w3schools 的示例中,打开 iframe 的按钮已存在于 HTML <a href="https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_fullscreen" rel="nofollow noreferrer">https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_fullscreen</a>.</p> <p>在我的解决方案中,我通过 javascript 添加按钮,因为带有 iframe 的页面已经存在,但没有此类按钮:</p> <pre><code>jQuery(document).ready(function($){ $(".node--view-mode-full iframe[src*='.pdf']").each(function (index) { $(this).addClass('fullscreenframe'); $(this).attr('id', 'fullscreen-'+index); $('<button onclick="openFullscreen()">Open in Fullscreen Mode</button>&nbsp;<strong>Tip:</strong> Press the "Esc" key to exit full screen.<br>').insertBefore(this); }); }); </code></pre> <p>然后添加一个全屏打开 iframe 的功能(与 w3schools 相同):</p> <pre><code>function openFullscreen() { var elem = document.getElementsByClassName("fullscreenframe")[0]; if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.webkitRequestFullscreen) { /* Safari */ elem.webkitRequestFullscreen(); } else if (elem.msRequestFullscreen) { /* IE11 */ elem.msRequestFullscreen(); } }; </code></pre> <p>当页面上只有一个带有 *.pdf 的 iframe 时,Everysing 工作正常。但是,当我在页面上有两个或多个 iframe,并且单击任何 iframe 附近的“以全屏模式打开”任何按钮时,我总是在全屏模式下只看到第一个 *.pdf...</p> <p>我知道,这是因为我只得到 elem = document.getElementsByClassName("fullscreenframe")[0]; 中的第一个 iframe;</p> <p>我知道我需要使用类似的每个或类似的东西,但我无法解决它。在搜索关于页面上一个全屏元素的所有解决方案时,没有关于页面上多个元素的解决方案...谢谢。</p> </question> <answer tick="true" vote="0"> <p>也许是这样的:</p> <pre><code>jQuery(document).ready(function($){ $(".node--view-mode-full iframe[src*='.pdf']").each(function (index) { $(this).addClass('fullscreenframe'); $(this).attr('id', 'fullscreen-'+index); $('<button onclick="openFullscreen(' + index + ')">Open in Fullscreen Mode</button>&nbsp;<strong>Tip:</strong> Press the "Esc" key to exit full screen.<br>').insertBefore(this); }); }); function openFullscreen(index) { var elem = document.getElementsByClassName("fullscreenframe")[index]; if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.webkitRequestFullscreen) { /* Safari */ elem.webkitRequestFullscreen(); } else if (elem.msRequestFullscreen) { /* IE11 */ elem.msRequestFullscreen(); } } </code></pre> </answer> <answer tick="false" vote="0"> <p>为什么不整合 jQuery?</p> <pre><code>const fullScreen = element => element.requestFullScreen(); // all modern browsers $(function(){ $(".node--view-mode-full iframe[src*='.pdf']").each(function (index) { $(this).addClass('fullscreenframe'); $(this).attr('id', 'fullscreen-'+index); $('<button class="fullScreen">Open in Fullscreen Mode</button>&nbsp;<strong>Tip:</strong> Press the "Esc" key to exit full screen.<br>').insertBefore(this); }); $(".fullScreen").on("click", function() { const $iFrame = $(this).closest('p').find('iframe.fullscreenframe'); if ($iFrame) fullScreen($iFrame.get(0)); // pass the DOM element }); }); </code></pre> </answer> </body></html>
通过 github 操作创建 EC2 AMI 时出现错误:exec: "session-manager-plugin": $PATH 中找不到可执行文件
==> learn-packer.amazon-ebs.ubuntu:exec:“session-manager-plugin”:在 $PATH 中找不到可执行文件 learn-packer.amazon-ebs.ubuntu:启动 portForwarding 会话“Amy-
我有以下功能: def do_login(用户): “”“登录用户。”“” 会话[CURR_USER_KEY] = user.id 以及以下测试: def test_do_login(自我): ...
create = open("lol.balbes.txt", 'w') oldfile = open("mbox-short.txt") 对于旧文件中的行: 线=线.上 线 = str(线) 创建.write(行) 创建.close() 我
当我在range-v3 v0.12.0中一起使用views::set_intersection和views::transform时,标题range/v3/view/set_algorithm.hpp和range/v3/view/transform.hpp的顺序很重要。如果是前者
Fragment 和 Custom View 可以实现类似的功能,我知道 Fragment 与 Custom View 相比可重用性更高,使用 Fragment 还有其他好处/增强吗?碎片支持吗...
进入该片段后屏幕变白。第二次应用程序停止工作。怎么解决这个问题?
@覆盖 public View onCreateView(LayoutInflater inflater, ViewGroup 容器, 捆绑已保存实例状态) { 上下文= getActivity(); view = inflater.inflate(R.layout.fragment_shor1, 包含...
在 Open Web UI 中启用 Searxng 作为 Web 搜索引擎时出错
我想在我的 Open WebUI(以前称为 Ollama Web UI)中启用 seachxng - 元搜索引擎。 我已经编写了 docker compose 文件,如下所示,但问题是,当我打开 Open Web UI 并选择 '
在swift项目中使用UIViewRepresentable时如何更新View
我正在努力在 swift 项目中展示 React-native-View。我通过异步操作下载bundlde文件,将bundle文件保存在app目录中,并用它来创建
我有一个电子表格,其中 1 个单元格中有以下链接: https://drive.google.com/open?id=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx,https://drive.google.com/open?id=yyyyyyyyyyyyyyyyyyyyyyyyyyyyyy 我...
我的代码在失败后不会重复 导入请求 将 open("valid_proxies.txt", "r") 作为 f: 代理 = f.read().split(" ”) site_to_check = ["https://open.
使用 PHP,当我生成 Stripe 会话时,我将 10 个不同的键:值对传递给元数据参数,如下所示: $checkout_session = \Stripe\Checkout\Session::create([ '
要在 CLI 中承担 AWS 角色,我执行以下命令: aws sts 假设角色 --role-arn arn:aws:iam::123456789123:role/myAwesomeRole --role-session-name test --region eu-central-1 这给...
如何防止背景中的 SwiftUI View 在覆盖 .sheet(isPresented:) 中的 View 时缩小几乎全屏?
我想用 .sheet(isPresented:) 打开最大高度内容,而不是对后面的内容进行动画处理和收缩(在红色矩形中)。可以吗?
以下功能失败并出现错误“Auth Session Missing” const { 错误 } = 等待 supabase.auth.updateUser({ 密码: 密码, }); 在我的手机上获取重置密码链接后...
为什么 boost asio tcp 解析器为异步解析创建线程
当我使用以下代码时,它会生成一个新线程。 solver_.async_resolve( 主机_、端口_、 野兽::bind_front_handler(&session::on_resolve,shared_from_this())); 但当我改变时...
Session 接口方法 createQuery(String queryString) 已弃用。为什么它被弃用?它已经过时了,但还没有提出任何替代方案。是否有类似的字符串 HQL 方法...
受 Supabase 文档的启发,我在 React Native 应用程序中有以下代码: 使用效果(()=> { if (session?.user?.id === null) 返回 常量通道=supabase .channel('值数据库更改', {
使用 PHP.net 替代 session_regenerate_id() 时,SESSION 为空[重复]
在 php.net 的 session_regenerate_id 手册页上,他们建议不要使用该函数,因为如果有人没有可靠的互联网连接,您可能会遇到问题。我用了他们的代码
为什么我无法使用 use:action Svelte 添加/删除主体类
我有这个功能 const bodyClass = (节点) => { if (open && !node.classList.contains("is-search-show")) { node.classList.add("is-search-show&quo...
产生错误: 类型错误:compare() 缺少 1 个必需的位置参数:'b' 比较两个文件的结果 from difflib import 不同 open('file1.txt') 作为 file_1, open('file2.txt') 作为 fil...
电流输出: 预期输出: 当前代码实施: 从“反应”导入反应 从 'react-native-svg-charts' 导入 { LineChart, XAxis, YAxis } 从 'react-native' 导入 { View, Text }
这是我现在的情况,我的形象是这样的 这是我当前的代码 这是我现在的情况,我的形象是这样的 这是我当前的代码 <View> <Image style={{width: '100%', height: 285}} source={{ uri: `${posterPath + data?.poster_path}`, }} resizeMode="cover" /> <Text>{data?.title}</Text> </View> 我希望我的图像看起来像这样 (这只是一个例子) 我知道在普通的CSS中我们是否可以使用object-position,但不幸的是React Native并不直接支持object-positionCSS属性,所以我很困惑如何实现这个 您需要使用 Flex:1,它使用整个屏幕,然后相应地定位和调整图像大小。 <View style={{flex:1}}> <Image style={{width:'100%', height:285}} source={{ uri: `${posterPath + data?.poster_path}`, }} resizeMode="cover" /> <Text>{data?.title}</Text> </View>
这是我写的一些代码: file_put_contents('a.upl', ''); 尝试 { $x = new \ZipArchive(); $x->open('a.upl'); } catch(\异常$e) { 回声 $e->getMessage(); } 它抛出一个 ZipA...
我一直在开发本教程中制作的应用程序版本(https://learn.microsoft.com/pl-pl/aspnet/core/data/ef-rp/complex-data-model?view =aspnetcore-5.0&tabs=visual-studio)。我有
需要演示 DataTypeAttribute 的这种用法(如 Microsoft 教程中所述)
我正在从 ASP.NET MVC 迁移到 ASP.NET Core,同时学习此页面上的 Microsoft 文档 https://learn.microsoft.com/en-us/aspnet/core/tutorials/razor-pages /验证?view=aspn...
员工 = {} def load_employees(): 以 open("employees.txt") 作为文件: 对于文件中的行: id_num, full_name = line.strip().split(",") 首先...
Python 文件: 名称=[] 以 open("names.csv") 作为文件: 对于文件中的行: 名称、颜色 = line.rstrip().split(",") print(f"{名称}, {颜色}") CSV ...
作为 UITextView inputAccessoryView 的 SwiftUI 视图具有不正确的框架
我正在尝试通过 UIHostingController 将 SwiftUI 视图作为附件视图添加到 UITextView 中。以下是我的 UIInputView 配置 struct AccessoryView: View { /* SwiftUI 视图 */ } c...
部分代码 area_file = open('/home/gkrish19/SIAM_Integration/Final_Results/area_chiplet.csv', 'a') area_file.write('NoP 驱动程序总面积为' + ' ' + str(Nop_area) + ' ' + 'um^2') 区域文件.c...
我想根据 SSMS (SQL Server) 中的源表在我的数据库中创建一个 VIEW TABLE。 但获得想要的视图表格式非常困难。 这里我举一个源表的例子。 C...
我编写了这段代码来使用 VS CODE 在 python 中打开一个文件 - with open("Answer Words.txt") as Answer_Words_File: Answer_Words = Answer_Words_File.read() 但它说“ FileNotFoundError:[
在如下所示的交互式会话中: >>> f=open('test.txt','w') >>> f 0x6e610 代表什么以及我能做什么
PHP8 从函数返回 ZipArchive getStream 使得包含的 zip 存档被关闭
私有函数 getFilePointer($file) { $pathInfo = 路径信息($file); $zip = new ZipArchive(); if (($res = $zip->open($file)) !== true) { 抛出新的例外...
变量改变时变量值的显示不改变(Jetpack Compose Android Studio)
应用程序使用mvvm和jetpack compose,屏幕(View,compose)使用以下代码显示是否已获得权限: val 上下文 = LocalContext.current 通过 remem 访问 val...
我想知道 CodeIgniter 是否允许页码后面的段以及执行此操作的最佳方法是什么? $config['base_url'] = '/controller/view/pg/'; 我也需要我的分页来传递这个: /控制...
Python 文件: 名称=[] 以 open("names.csv") 作为文件: 对于文件中的行: 名称、颜色 = line.rstrip().split(",") print(f"{名称}, {颜色}") CSV ...
我尝试通过 ruby rbnev 安装 jekyll,然后将 open ~/.bash_profile 放入终端并在文本编辑器中输入 eval "$(rbenv init -bash)" ,这是唯一的方法...
MVC ASP.NET Core Identity,创建登录、注册操作。 AuthController
公共类AuthController:控制器 { SignInManager _signInManager { 获取; } UserManager _userManager { 获取; } 角色管理器 public class AuthController : Controller { SignInManager<AppUser> _signInManager { get; } UserManager<AppUser> _userManager { get; } RoleManager<IdentityRole> _roleManager { get; } public AuthController(SignInManager<AppUser> signInManager, UserManager<AppUser> userManager, RoleManager<IdentityRole> roleManager) { _signInManager = signInManager; _userManager = userManager; _roleManager = roleManager; } public IActionResult Login() { return View(); } [HttpPost] public async Task<IActionResult> Login(string? returnUrl,LoginVM vm) { AppUser user; if (!ModelState.IsValid) { return View(vm); } if (vm.UsernameOrEmail.Contains("@")) { user = await _userManager.FindByEmailAsync(vm.UsernameOrEmail); } else { user = await _userManager.FindByNameAsync(vm.UsernameOrEmail); } if (user == null) { ModelState.AddModelError("", "Username or password is wrong"); return View(vm); } var result = await _signInManager.PasswordSignInAsync(user, vm.Password, vm.IsRemember, true); if (!result.Succeeded) { if (result.IsLockedOut) { ModelState.AddModelError("", "Too many attempts wait until " + DateTime.Parse(user.LockoutEnd.ToString()).ToString("HH:mm")); } else { ModelState.AddModelError("", "Username or password is wrong"); } return View(vm); } if (returnUrl != null) { return LocalRedirect(returnUrl); } return RedirectToAction("Index","Home"); } public IActionResult Register() { return View(); } [HttpPost] public async Task<IActionResult> Register(RegisterVM vm) { if (!ModelState.IsValid) { return View(vm); } var user = new AppUser { Fullname = vm.Fullname, Email = vm.Email, UserName = vm.Username }; var result = await _userManager.CreateAsync(user, vm.Password); if (!result.Succeeded) { foreach (var error in result.Errors) { ModelState.AddModelError("", error.Description); } return View(vm); } var roleResult = await _userManager.AddToRoleAsync(user, Roles.Member.ToString()); if (!roleResult.Succeeded) { ModelState.AddModelError("", "Something went wrong. Please contact admin"); return View(vm); } return View(); } public async Task<IActionResult> Logout() { await _signInManager.SignOutAsync(); return RedirectToAction("Index", "Home"); } public async Task<bool> CreateRoles() { foreach (var item in Enum.GetValues(typeof(Roles))) { if (!await _roleManager.RoleExistsAsync(item.ToString())) { var result = await _roleManager.CreateAsync(new IdentityRole { Name = item.ToString() }); if (!result.Succeeded) { return false; } } } return true; } } } 所以,我在代码中搞乱了登录、注册和注销,现在这个 RoleManager 的事情让我摸不着头脑。我只是想为我的管理员用户提供一些额外的权力,但我有点不知道该怎么做。如果您能用简单的语言解释步骤或需要进行哪些更改来帮助我,那就太棒了。 我的目标是让管理员用户在我的系统中体验更好,您对此的建议非常有用。尝试了解 RoleManager 的事情以及如何为我的管理员用户提供更多能力。您直接的帮助可能会对我解决这个问题产生很大的影响! 定义管理员角色 创建管理员用户 更新注册流程: var roleResult =等待_userManager.AddToRoleAsync(用户,vm.IsAdmin? Roles.Admin.ToString() : Roles.Member.ToString()); 使用管理员角色: [授权(角色=“管理员”)] 公共 IActionResult AdminDashboard() { // 特定于管理的逻辑 } 5.提升管理能力: if (User.IsInRole("管理员")) { // 特定于管理的逻辑 } 中间件配置: services.AddIdentity() .AddRoles() .AddEntityFrameworkStores(); 7.创建角色方法: 公共无效配置(IApplicationBuilder 应用程序,IHostingEnvironment env) { // 其他中间件配置 // Create roles during application startup var authController = new AuthController(/* inject your dependencies here */); authController.CreateRoles().GetAwaiter().GetResult(); }
我需要最后一步进入View, 但不会丢失标题(因为scrollIntoView也垂直滚动) 如何实现它仅水平滚动而不垂直滚动到视图中 常量应用程序=...
Python 代码仅从 csv 文件读取 1 个值 [已关闭]
Python 文件: 名称=[] 以 open("names.csv") 作为文件: 对于文件中的行: 名称、颜色 = line.rstrip().split(",") print(f"{名称}, {颜色}") CSV ...
是否可以检测当前哪个View属于DragGesture的位置?
我希望能够检测是否有任何视图落在 DragGesture 的位置下。 我尝试将 DragGesture 添加到每个视图(在本例中为圆圈),希望该操作能够...
ModuleNotFoundError:没有名为“keras.src”的模块 - Python
我正在尝试使用以下代码加载我的模型: `#加载模型 以 open('tomato_model.pkl', 'rb') 作为模型文件: #from keras.models 导入 load_model 模型 = pickle.load(model_file)` 但是...
我在Google colab中成功安装了open AI;但是,我无法导入它...我安装了最新版本的 OpenAI(和打字扩展)... 这是错误: 导入错误...
在开发反应本机应用程序时,我正在努力解决此警告。该应用程序是一个待办事项列表,它给了我一个警告,如下所示:文本节点不能是 <
如何使 Text View 锚点位于 SwiftUI 的前沿?
我正在尝试在我的一个应用程序中为城市制作“卡片视图”。该卡的右上角有一个“文本”视图来显示信息。文本将根据...的长度自行调整
访问 StateObject 的对象而不将其安装在 View 上
关于这个问题还有其他答案,但没有看到可以解决问题,因为在我的例子中,我使用的是 NSViewRepresentable 可可视图,这不完全是 SwiftUI 视图。 我有这个代码:
自定义 ListViewItem 控件显示类名称,而常规 ListView 控件显示实际数据
以下是 WPF 应用程序的代码片段,其中我使用 ListView 控件和自定义 ListView 控件,但在 UI 中自定义 ListView 控件显示类名称,其中为 List View
我通过最小的 api 生成端点,并尝试使用 Microsoft.AspNetCore.OpenApi 包生成文档,但我不知道如何设置一个部分,并且我的所有端点都出现在 sin...
在 OpenLiberty 中升级到 Jakarta-EE 10 后,ClientHeadersFactory 中的 CDI 失败
我在 OpenJDK 21.0.1+12-29 上为我的应用程序使用 Open Liberty 23.0.0.12。升级 server.xml 以使用 Jakarta EE Web Profile 10.0 而不是 9.1 后,ClientHeadersFactory 中的注入确实...