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.
display: inline-blockdocument.documentElement.innerHTML = document.documentElement.innerHTMLI hope it will help you.
New
I read docs and it was helpful.
msapplication-navbutton-coloris 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 likemsapplication-navbutton-colordo not trigger repaint behavior.