- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
在我的网站上,我必须构建多个剧透。我打算使用此代码来制作剧透:How to create multiple spoiler buttons .
我正在寻找一种在页面 'A.html' 上创建指向页面 'B 的链接 'x' 的简单方法.html' 并在 'B.html' 页面上打开扰流板 'x'。因此剧透 name="x" 和 URL 应该类似于 B.html#x。
换句话说,我需要A.html 页面上的目录,以防止B.html 页面上的剧透。
但如果您直接进入页面 B.html,所有剧透都应该默认关闭,并可以通过单击剧透标题打开和关闭它们。
任何现成的解决方案将不胜感激。解决方案不一定基于我上面提供的代码。
好吧,我知道这是完全错误的,但这是我尝试过的。
A.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.spoiler {
display:none;
width:100%;
height:50px;
background-color:red;
margin-bottom:10px;
}
.contentBoxFooter{position:absolute;bottom:10px;}
</style>
</head>
<body>
<div id="x" class="spoiler">Content1</div>
<div id="y" class="spoiler">Content2</div>
<div id="z" class="spoiler">Content3</div>
<div class="contentBoxFooter">
<a href="B.html#x" class = "spoilerButton">Show/Hide</a>
<a href="B.html#y" class = "spoilerButton">Show/Hide</a>
<a href="B.html#z" class = "spoilerButton">Show/Hide</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</body>
</html>
B.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.spoiler {
display:none;
width:100%;
height:50px;
background-color:red;
margin-bottom:10px;
}
.contentBoxFooter{position:absolute;bottom:10px;}
</style>
</head>
<body>
<div id="x" class="spoiler">Content1</div>
<div id="y" class="spoiler">Content2</div>
<div id="z" class="spoiler">Content3</div>
<div class="contentBoxFooter">
<a href="#x" class = "spoilerButton">Show/Hide</a>
<a href="#y" class = "spoilerButton">Show/Hide</a>
<a href="#z" class = "spoilerButton">Show/Hide</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".spoilerButton").click(function (e) {
e.preventDefault()
var foo=$(this).attr('href')
$(''+foo).slideToggle(1000);
});
});
</script>
</body>
更新:这是我需要的示例:https://support.google.com/plus/#topic=3049663每个部分都添加一个以链接结尾的唯一 URL。
最佳答案
如果您不喜欢通过查询 url 来执行此操作,则需要在新的 javascript window
中打开 B.html
。
在那里你可以做一些事情,例如。例如:
window win = window.open("B.html");
win.document.myVariable = "test";
然后您可以像通常使用 myVariable
编辑:如果您只想将页面 B.html
加载到页面 A.html
的剧透中,那么它只是一个 jquery 命令:
$("#spoiler").load("B.html");
关于javascript - 在单独的页面上打开剧透,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23173686/
如何在 Grav CMS 中剧透(隐藏文本或 block ) Markdown 或插件?官方不剧透markdown和 Markdown Extra (由 Grav 支持)。 我尝试像 this 这样的
我一直在研究 Python Challenge 中提出的问题.其中一个问题要求从一堆字符中筛选出最稀有的字符。 我的方法是从文本文件中读取字符,将字符/出现作为键/值对存储在字典中。按值对字典进行排序
我有一个很大的矩阵 A,它有 1GB 的 double 值,当我将它重新整形为不同的维度时,它的速度快得令人难以置信。 A=rand(128,1024,1024); tic;B=reshape(A,1
好吧,让我解释一下我的意思是哪种“剧透标签”: 在我所在的 phpBB 论坛中,有一个 [剧透] BBCode 隐藏了里面的文本,有一个显示/隐藏的按钮,应该看起来像发布页面中的 prosilver
我在很多记录中都有这个字符串 [spoiler:abcdefgh]。 abcdefgh 是可变字符。我希望它成为 [剧透]。所以我想删除 :abcdefgh。 我知道查询是: UPDATE post
所以我正在尝试参加 Stripe CTF 竞赛,但我对安全性一无所知,所以当我遇到问题时,我查看了问题 3。我仍然不明白它是如何工作的。 黑客攻击的目标是通过使用设置了 SUID 位的应用程序访问不同
我之前曾尝试暴力破解它,但没有成功。这是我的递归尝试#2(第一次使用递归方法)。请帮忙! 发生的情况是这样的:代码运行良好,数字较小,但是当我们达到一百万时,代码就会运行,并且什么也不会发生。在 Ec
我是一名优秀的程序员,十分优秀!