基础 5 显示模式不起作用

2023-06-21前端开发问题
1

本文介绍了基础 5 显示模式不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

祝大家今天好,

我正在为我的迷你项目使用基础 5.我想使用框架的显示/模式功能.但是好像不行.

I'm using foundation 5 for my mini project. I want to use the reveal/modal feature of the framework. But it seems it does not work.

index.html

<!DOCTYPE html>
<html>
<head>
    <title>Job Posting</title>
    <link rel="stylesheet" type="text/css" href="../css/normalize.css">
    <link rel="stylesheet" type="text/css" href="../css/foundation.min.css">

    <script type="text/javascript" src="../js/vendor/custom.modernizr.js"></script>
</head>
<body>
  <a href="#" class="button" data-reveal-id="myNormal">click</a>
  <div class="reveal-modal" id="myNormal">
      Modal
      <a class="close-reveal-modal">x</a>
  </div>
   <script src="../js/vendor/jquery.js"></script>
   <script src="../js/foundation/foundation.js"></script>
   <script src="../js/foundation/foundation.reveal.js"></script>
   <script>
      $(document).foundation();
   </script>
</body>

我很确定浏览器加载了 js,因为它在调试器中没有显示任何错误.而且我知道它在我遗漏的代码中的某个地方,但自从我遇到这个已经有几个小时了.任何帮助将不胜感激.

I'm pretty sure that the browser loaded the js as it does not show any error in the debugger. And I know it's somewhere in the code that I left out but it's been a couple of hours since I ran into this. Any help would be much appreciated.

推荐答案

你可能忘记了 data-reveal :

<div class="reveal-modal" id="myNormal" data-reveal>

这篇关于基础 5 显示模式不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

The End

相关推荐

layui 实现实时刷新一个外部的div
主页面上显示了一个合计,在删除和增加的时候需要更改这个总套数的值: //html代码div class="layui-inline layui-show-xs-block" style="margin-left: 10px" id="sumDiv"spanSOP合计:/spanspan${totalNum}/spanspan套/span/div 于是在我们删除这个条数据后,...
2024-11-14 前端开发问题
156

layui要如何改变时间日历布局大小?
问题描述 我想改变layui时间日历布局大小,这个要怎么操作呢? 解决办法 可以用css样式对时间日历进行重新布局,具体代码如下: !DOCTYPE htmlhtmlheadmeta charset="UTF-8"title/titlelink rel="stylesheet" href="../../layui/css/layui.css" /style#test-...
2024-10-24 前端开发问题
271

jQuery怎么动态向页面添加代码?
append() 方法在被选元素的结尾(仍然在内部)插入指定内容。 语法: $(selector).append( content ) var creatPrintList = function(data){ var innerHtml = ""; for(var i =0;i data.length;i++){ innerHtml +="li class='contentLi'"; innerHtml +="a href...
2024-10-18 前端开发问题
125

“数组中的每个孩子都应该有一个唯一的 key prop"仅在第一次呈现页面时
quot;Each child in an array should have a unique key propquot; only on first time render of page(“数组中的每个孩子都应该有一个唯一的 key prop仅在第一次呈现页面时)...
2024-04-20 前端开发问题
5

如何制作 TextGeometry 多线?如何将它放在一个正方形内,以便它像 html 文本一样包裹在 div 内?
How do I make a TextGeometry multiline? How do I put it inside a square so it wraps like html text does inside a div?(如何制作 TextGeometry 多线?如何将它放在一个正方形内,以便它像 html 文本一样包裹在 div 内?) - IT屋-程序员软件开发技术分享社...
2024-04-20 前端开发问题
6

缩放背景图像以适合 ie8 窗口
Scale background image to fit ie8 window(缩放背景图像以适合 ie8 窗口)...
2024-04-19 前端开发问题
11