当满足javascript/jquery条件时显示DIV(包括jsFiddle链接)
Display DIV when javascript/jquery condition is met (jsFiddle link included)
当"休息"时间倒计时时钟达到10时,我希望"休息"div在"显示"div 上显示和显示,导致"显示"div 被覆盖。当休息时间达到 5 时,我希望"休息"div 隐藏,使"显示"div再现。
http://jsfiddle.net/n2learning/9FPG8/2/
任何帮助都会很棒,丹麦克朗
我认为解决了
http://jsfiddle.net/9FPG8/10/
小提琴。http://jsfiddle.net/9FPG8/11/
CSS
#rest.onTop {
position:absolute;
top:0;
left:0;
}
.JS
if(time == 10){
document.getElementById("rest").className="onTop";
} else if(time == 5){
document.getElementById("rest").style.display="none";
} else if(time == 0) {
el.innerHTML = "Times up!";
clearInterval(interval);
return;
}
我也解决了这个问题。div 位置必须设置为绝对值,并且 'display'div 的位置也使用 javascript 进行计数。
这是我更新的解决方案。我还使用 gaurang 的解决方案简化了代码:
function countdown(element, minutes, seconds) {
...
var eld = document.getElementById('display');
var eldp = getElementPosition(eld);
if(time == 10){
el.style.top = eldp.top+'px';
el.style.left = eldp.left+'px';
el.style.position = 'absolute';
} else if (time == 5){
el.style.display='none';
}
...
function getElementPosition(Elem) {
var offsetLeft = 0, offsetTop = 0;
do {
if ( !isNaN( Elem.offsetLeft ) ) {
offsetLeft += Elem.offsetLeft;
offsetTop += Elem.offsetTop;
}
} while( Elem = Elem.offsetParent );
return {top: offsetTop, left: offsetLeft };
}
元件位置的测量从这里开始。
相关文章:
- 添加文字和评论功能更新Div
- 包括用于facebook评论框的JavaScript SDK
- 点击后隐藏潜水?(但如果Div是一面旗帜呢?)
- 使用JavaScript动态插入DIV的成本有多高
- DIV并排,位置不正确
- Div根据<选择>菜单
- 查找元素高度,包括边距
- Href:当前DIV中的目标ID
- Onchange没有'不要显示或隐藏Div
- 绝对定位不适用于Javascript DIV
- 在Rails中更新Div,而不更改更新请求后的视图
- asp.net,包括iss上的javascript slow
- how to convert html <div> to pdf
- SuiteScript2.0-包括一个自定义文件
- 如何在不影响其他元素的情况下扩展DIV
- javascript加密实现,包括可信否认
- 使用jQuery在页面上浮动DIV
- 如何通过点击机身上的任何位置来关闭弹出的DIV
- 当满足javascript/jquery条件时显示DIV(包括jsFiddle链接)
- 将HTML加载到DIV中,但保留CSS,JS包括