Updating IE10 pinned site's back/forward buttons' color without refresh

StackOverflow https://stackoverflow.com/questions/19777966

Question

Currently, my page contains the following meta tags in the <head>:

<meta name="application-name" content="MLP Now" />
<meta name="msapplication-starturl" content="./" />
<meta name="msapplication-navbutton-color" content="#C693FB"/>
<meta name="msapplication-tooltip" content="MLP Now" />

This works just fine, and the browser happily updates the button color to match the set value. But here's the catch, this only happens when the page is reloaded.

I don't want to force my users to reload just to see their button color being changed, so I was curious if there's a way to do this without reloading the page.

I tried changing the value of the meta tag with JavaScript, but it doesn't work, as you might expect.

var newcolor = "#123456";
$('meta[name="msapplication-navbutton-color"]').attr('content',newcolor);

Edit: To clarify, the meta tag does get updated, only the buttons don't change color in IE.

Was it helpful?

Solution

  • Try to remove and add meta tag
  • Try to repaint all page. Add html element repaint css styles via display: inline-block
  • Very bad way but ... try document.documentElement.innerHTML = document.documentElement.innerHTML

I hope it will help you.

New

I read docs and it was helpful. msapplication-navbutton-color is a runtime parameter, it means styles apply only once, when page start loading...So you can't to change color. After page load changing runtime styles(domNode.runtimeStyle) and metadata like msapplication-navbutton-color do not trigger repaint behavior.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top