个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我为一位同学整理了一个简短的脚本，并认为我会显示一个漂亮的背景淡入淡出，使它看起来更漂亮。我可以实现颜色变化，但它不会从一种状态平稳过渡到另一种状态。我认为这会奏效，但也许我错了或遗漏了什么。
脚本中的其他所有内容都有效，因此请继续使用，如果您愿意的话。它所做的只是导致屏幕暂停，以便在执行任何其他操作之前显示错误或消息。
模板:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Message Expansion Demonstration</title>
<style>
body {
margin:0 auto;
padding:0 0;
height:100%;
width:100%;
text-align:center; }
#haltPage {
display:none;
position:absolute;
height:100%;
width:100%;
top:0px;
background-color:rgba(0, 0, 0, 0.0);
transition: background-color 1s linear .1;
-webkit-transition: background-color 1s linear .1;
-o-transition: background-color 1s linear .1;
z-index=9999;
}
.wrong {
position:relative;
padding:auto auto;
margin:auto auto;
height:250px;
width:400px;
background-color:#666;
border-bottom-left-radius:0.5em 0.5em;
border-bottom-right-radius:0.5em 0.5em;
border-top-left-radius:0.5em 0.5em;
border-top-right-radius:0.5em 0.5em;
box-shadow:5px 10px 25px #000; }
.wrong p {
padding:10px; }
</style>
<script>
function wrong ( classID )
{
var on = 'block';
var visable = 'rgba(0, 0, 0, 0.4)';
clearClass ( );
document.getElementById('haltPage').style.display = on;
document.getElementById('haltPage').style.backgroundColor = visable;
document.getElementById(classID).style.display = on;
}
function clearClass ( )
{
var off = 'none';
document.getElementById('haltPage').style.display = off;
document.getElementById('wrong1').style.display = off;
document.getElementById('wrong2').style.display = off;
document.getElementById('wrong3').style.display = off;
}
</script>
</head>
<body>
<a href="#" onClick="wrong('wrong1')">Wrong Answer One</a><br><br>
<a href="#" onClick="wrong('wrong2')">Wrong Answer Two</a><br><br>
<a href="#" onClick="wrong('wrong3')">Wrong Answer Three</a><br><br>
<!-- This is not seen untill called -->
<div id="haltPage">
<br><br><br>
<div id="wrong1" class="wrong">
<h1>Wrong!</h1>
<p>You are wrong!<br><a href="#" onClick="clearClass();">Close</a></p>
</div>
<div id="wrong2" class="wrong">
<h1>Wrong!</h1>
<p>You are wronger! < Not a word<br><a href="#" onClick="clearClass();">Close</a></p>
</div>
<div id="wrong3" class="wrong">
<h1>Wrong!</h1>
<p>You are wrongest! < duh<br><a href="#" onClick="clearClass()">Close</a></p>
</div>
</div>
</body>
</html>
最佳答案
尝试在“#haltPage”的 CSS 定义中的时间值后面添加一个“s”:
transition: background-color 1s linear .1s;
-webkit-transition: background-color 1s linear .1s;
-o-transition: background-color 1s linear .1s;
关于javascript - 底色不褪色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9829050/
25
4
0
我对 jQuery 还很陌生，但我正在寻找一个简单的脚本，通过淡入和淡出的方式在标题中循环 3 或 4 个背景图像。它们是透明的 png，因此我尝试过的许多 slider 都不起作用。 有什么想法吗？
我需要一个用 Java 编写的颜色褪色示例。我的要求是我有两个矩形。一个填充红色，另一个填充白色。当我点击任何按钮时，我希望红色开始褪色并移动绿色。一旦到达绿色位置，另一个矩形就会自动从黄蓝色开始。有
尝试设置 UIAlertController backgroundColor 但结果是“褪色”颜色 let alert = UIAlertController(title: "some title",
我正在尝试制作一个带有渐变 block 动画的 slider ，就像 here .问题是，在我的例子中，我试图全屏显示，这意味着高度和宽度将是可变的。这意味着背景位置技巧将不起作用，因为它不会调整背景
这是我想要的东西achieve . 类似于 this 的东西*但这会通过使用颜色而褪色。 Long wordingggggggggggggggggggggggggggggggggggg
我用 glColor3f() 和 GL_QUAD_STRIP 绘制了 2 个相邻的方 block ，但它们似乎在 2 个方 block 之间褪色，有什么办法可以防止这种情况发生吗？或者 GL_QUAD
我正在开发一个用户脚本，该脚本将缺失的功能添加到我无法控制的第 3 方网站。 它将根据页面和一些 webAPI 调用的结果计算 URL。这些 URL 将添加到页面的 HTML 中。 然后对于呈现为 :
我只是想在页面上有一个特定的部分来交换内容(比如 3 个不同的元素)，并具有淡入淡出的效果。所以我想我可以为内容部分定义我的容器属性，然后我可以定义将换入和换出的 3 个 div 容器中的每一个。因此
我在 bootstrap carousel 上苦苦挣扎了几天，它应该像默认的那样向左/向右滑动，但增加了淡化(新元素进入时慢慢获得不透明度，而前一个元素在移出时慢慢失去不透明度)，我尝试了很多变体，但
我对 Qt 的样式表功能有一些疑问。这真的很棒，但感觉这个功能还没有出现太久，真的吗？这是迄今为止最简单的方式来设置我的 GUI 样式。 是否可以在样式表中添加褪色？每当鼠标悬停在某个小部件上时，我不
我正在使用以下命令 ffmpeg -i ~/Desktop/input.mp4 -filter_complex "color=black:100x100[c];\ [c][0]scale2r
我正在尝试实现一个“返回顶部”链接，该链接会在用户向下滚动页面一定量后淡入我的页面。 我注意到在我的某些页面上，“返回顶部”链接会在页面上闪烁，然后再自行隐藏，但在其他页面上则不会。为了找出“链接闪烁
我想将 svg 文件加载到一个 div(或其他)中，我什至可以成功地做到这一点 here : var div_svg = d3.select("div#example"); svg1 = "https
我是一名优秀的程序员,十分优秀！