在HTML5/JS应用程序中,我们有一些视图,其中包含一些样式,具体取决于data-attribute元素:
喜欢
<li data-level="0"></li>
Run Code Online (Sandbox Code Playgroud)
要么
<li data-level="1"></li>
Run Code Online (Sandbox Code Playgroud)
CSS
li[data-level^="1"] {
/* some styles */
}
Run Code Online (Sandbox Code Playgroud)
这似乎无处不在page reload.
但是当通过JS以编程方式设置data-attribute时,CSS属性将在所有相关的桌面浏览器中呈现,但不会在移动Safari中呈现.
JS部分看起来像这样:
this.$el.attr('data-level', this.model.getLevel())
Run Code Online (Sandbox Code Playgroud)
关于如何强制应用这些属性的任何想法(刷新/重绘某些东西)?
我想避免使用class属性和不同的类,因为事情比这里显示的更复杂......
问题
在IE10上发生.(IE8工作正常.)
我编写了一些JavaScript代码,在20分钟不活动后,将浏览器重定向到另一个URL以指示用户已注销.通常这很好.但是我注意到一个奇怪的情况......如果用户的Windows计算机在此超时期间被锁定,那么看起来好像什么也没发生.
但是,当我查看浏览器的URL栏时,我可以清楚地看到该URL已经更新到自动注销页面.但是浏览器窗口的整个内容仍然显示旧页面!由于某种原因,浏览器窗口没有重新绘制/刷新.它看起来像是冻结了.
此时......如果我在页面上快速鼠标点击,则浏览器"醒来"并显示新内容.(似乎只有一次鼠标点击是不够的.你点击的速度越快,"唤醒"的速度就越快.)
理论
我最好的猜测是IE10浏览器在计算机锁定时停止重新绘制窗口.但是,我确实认为JavaScript引擎仍在运行,因为我在不同的时间间隔测试了另一个具有多个JS新Date()时间戳的场景,当屏幕最终重新绘制时,每个日期时间都是唯一的,显示实际发生的时间.
重新创建问题 - 版本1
我注意到这只发生在重定向到公司本地Intranet上的URL时.我不知道为什么会这样......但如果我有URL作为谷歌或雅虎的主页....那么我无法重新创建这个问题.它只是正常工作.让我想知道它是否可能是某种组策略/可信区域/内联网与互联网问题......
<!DOCTYPE HTML>
<html>
<head></head>
<body>
<script>
var url = 'http://IntranetWebApps.OurCompany.com/MyWebApp/Home'; // fails
//url = 'http://www.yahoo.com'; // this 'Internet' site works
//url = 'http://www.google.com'; // this 'Internet' site works
setTimeout(function () {
window.location.href = url;
}, 10000 // wait 10 seconds, then execute redirect
);
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
题
有没有人有任何想法如何解决这个问题,以便IE10窗口将永远重绘,而不是显示陈旧的内容?
javascript windows internet-explorer repaint internet-explorer-10
我第一次使用Swing来创建一个简单的GUI.它包含一个JFrame我放置了一个单独的JButton,当点击它时,调用一些其他代码,大约需要.3秒钟返回.
就在调用此代码之前actionPerformed(),我想更新按钮上的文本以通知用户正在进行处理.我的问题是,直到3秒钟的呼叫返回后,按钮上的文字才会更新.我希望在通话过程中出现更新的文本,然后我会将其更改回来.
当我点击按钮时,调用repaint()on JButton不会执行任何操作并在JFrame结果中调用它Exception in thread "AWT-EventQueue-0" java.lang.NullPointerException.
例如,我需要在运行时禁用两个按钮.在我禁用第一个按钮后,它会变成灰色,第二个 - 它也会变成灰色.但我不知道如何同时重新粉刷!
我需要这样的东西:
如何实现?
我有一个很长的JavaScript函数并执行许多任务,我想通过使用消息更新SPAN元素的内容来向用户报告进度.我尝试在整个功能代码中添加document.getElementById('spnProgress').innerText = ...语句.
但是,当函数执行时,UI将不会更新,因此您只能看到写入SPAN的最后一条消息,这不是很有用.
我目前的解决方案是将任务分解为多个函数,在每个函数结束时我设置SPAN消息,然后使用window.setTimeout调用以非常短的延迟(比如10ms)"触发"下一个函数.这产生控制并允许浏览器在开始下一步之前用更新的消息重新绘制SPAN.
但是我觉得这很乱,很难遵循代码,我认为必须有更好的方法.有没有人有什么建议?有没有办法强制SPAN重绘而不必离开函数的上下文?
谢谢
MyApp(.NET c#)由OtherApp(c ++)触发.
触发后,我的应用程序将占据整个屏幕并为用户提供两个选项.一个选项退出MyApp并返回到OtherApp主屏幕.第二个选项退出初始屏幕并显示另一个用户输入屏幕 - 输入后退出并返回到OtherApp.
有时候,OtherApp屏幕不会重新绘制(只能看到背景,而不能看到按钮) - 我不能轻易复制它(当我这样做时看起来像是侥幸),但我已经在很多应用程序上看到了它.
有没有办法MyApp可以强制屏幕重绘OtherApp?
可能是什么导致了这个?
澄清 - 其他应用程序不是我们的.我们的客户使用OtherApp.MyApp由filewatcher事件触发.当我们看到一个文件时,我们会处理它.如果这是我们要查找的文件,我们会为用户提供两个选项.OtherApp不知道MyApp存在.
我的视图中有一些方法可以修改调用时绘制的一些形状.在Java中,为了确保组件更新,我会打电话repaint().有什么东西能确保我的观点正确更新吗?
我读的地方,调用invalidate()的onDraw()方法将让事情最新的,所以我不会需要有像repaint()在我的方法是修改形状的绘制.
这是正确的,还是我还有别的办法?
编辑
要添加一个示例,我在视图中调用的方法是:
public void setLineThickness(int thickness) {
aLineThickness = thickness;
if(aLineThicness > 1)
//repaint(); - Okay in Java but not in Android
}
Run Code Online (Sandbox Code Playgroud) 我正在制作游戏记忆,当你选择两张牌时,如果匹配你就得保留它们,否则你会把它们转回去.如果你记得你已经选择过的牌,你可以对接下来的两张牌进行更好的猜测.
我repaint()遇到的问题涉及不立即重新粉刷的方法.
当我翻转第二张卡片时,无论结果如何,我都要显示两张卡片在放弃或翻转之前向右翻转.我是通过打电话来做的sleep().
当然,如果我repaint()将卡片正面向上翻转,等待一秒钟,然后repaint()再根据它们的值,有用的小Java只会重绘一次(我想念C!).
基本上我想在我之前强制调用更新sleep().我已经阅读了一些其他线程,基本上说最好的方法是创建两个线程来保持逻辑和图形分离,然后你可以使用sleep()你的逻辑并保持你的GUI更新,但我在第一学期CS课程的第一学期在高中时,我希望将其保持在课程的水平上(尽管我花了很多时间在夏季网上开发和编写C语言).
因为我知道StackOverflow上有用的人喜欢阅读代码,所以这是我在下面提到的程序的一部分.该类HitArea是Card对象,cards[]数组包含一定数量HitArea的.(我没有重命名HitArea该类).activeCard1并且activeCard2是HitArea我用来跟踪用户的两个选择的实例,并且空白构造函数是保留的"不可见" HitArea,尽管我稍后会将其更改为null.最后,cards.flip()反转一个toggle布尔值,确定卡是否正面朝上.
public void respond(HitArea choice)
{
if(choice.inGame)
{
if(activeCard1.value == 0 && activeCard1.value == 0)
activeCard1 = choice;
else if((!(activeCard1.value == 0) && activeCard2.value == 0) && (activeCard1.id != choice.id))
{
activeCard2 = choice;
check();
}
}
}
public void check()
{
update(); …Run Code Online (Sandbox Code Playgroud) 我试图阻止浏览器重新绘制以提高使用 CSS 动画的大型单页应用程序的性能。
如果我有一个对其:hover { transform: scale(...) }有影响的元素,我可以通过使用will-change: transform和/或此处transform: translateZ(0)提到的来防止重绘。
但是一旦我transition向该元素添加 a ,许多元素就会重新开始重新绘制。
这是一个演示代码笔和它的 gif
唯一可以防止这种重绘的方法是将其他元素放在 DOM 顺序中的动画元素之前,或者将动画元素的 z-index 索引在其他元素之上。但是对于复杂的单页应用程序,我不想对任何只需要悬停过渡的元素的 z-index 进行微观管理。
任何其他想法或参考?我还没有transition在别处讨论过这个与s 相关的特定问题。
我正在使用 CSS 变量制作动画,其中 CSS 变量值根据页面滚动而变化。然后将该变量用于具有关键帧的动画。
最初它只能在 Firefox 上正确更新。同时,我找到了一种方法让它在 Chrome 上也能工作,通过强制重新绘制,在这种情况下,将颜色从 #000 动画到 #001。
/* --scale is dynamic changed by JS */
@keyframes move {
0% {
transform: translateX(0) scale(var(--scale));
color: #000;
}
100% {
transform: translateX(33vw) scale(1.5);
color: #001;
}
}
Run Code Online (Sandbox Code Playgroud)