Welcome Guest Search | Active Topics | Sign In | Register

Manipulate Stylesheet with EO.WebBrowser Options
PhilipT
Posted: Sunday, May 18, 2014 12:24:35 PM
Rank: Advanced Member
Groups: Member

Joined: 2/15/2014
Posts: 52
Hi,

Is it possible to manipulate the stylesheet before the page is shown? I looked at the UserStyleSheet property of BrowserOptions class. It says that it can apply additional style rules to the document, unfortunately, there's no proper example on how to do it.

Regards
Philip
eo_support
Posted: Monday, May 19, 2014 12:46:11 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,196
Hi,

There is no reliable way to manipulate the stylesheet before the page is shown since the browser engine will always try to display "something" even before any stylesheet is loaded. UserStyleSheet was planed for injecting custom CSS rules immediately into the frame after it has been created, however it is not implemented in the current build. Even after this is implemented, the styles that actually appears in the page can still override it, which makes this property relatively insignificant. So we are still not sure whether we should implement it or remove it all together.

One way to manipulate style AFTER the page is loaded is to do it through the WebView's JSInitCode property. For example, you can set it something like this:

Code: JavaScript
//Set JSInitCode to the following code. This code is executed
//immediately when a new frame is created. However the code
//merely hook up to the window's onload event and then run
//the code to dynamically inject some style into the page after
//the page has been loaded 
window.addEventListener("load", 
    function()
    {
        //Create a new div and inject some styles. This DIV is 
        //appended as the last child element of the body element,
        //which give the injected style higher priorities
        var div = document.createElement("DIV");
        div.innerHTML = "<style> body { font-size: 30px; } </style>";
        document.body.appendChild(div);
    });


Hope this helps. Please let us know if this works for you.

Thanks!


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.