7

I'm working on a website, based on Sharepoint 2013 and c#, which needs a day/night mod.

Sharepoint allows me to generate a theme which ids are the same for everyone. The background color is white.

Because the day/night mod is a need by user and not for everybody. So I can't change the theme.

Using a webcontrol and a cookie, it allows me to overload the css to change the background color in black, (and other things) of the page.

My problem is:

Between two loading pages, the white background color coming from the theme come again for less than a seconde.

Do you have an idea of how to suppress this white page?

PS : I'm sorry if my question was already ask. I think it look like Day and Night Display Mode but not totally

Edit : I was trying of show you my point of you that I forgot to show my code. I'm using a userCustumControl to load the new css.

ModDayNightUserControl.ascx

<div id="DivModeJourNuit" runat="server" style="float: right">
<span runat="server" id="SpanModeJourNuit"></span>
<asp:ImageButton runat="server" ID="ImageModeJourNuit" OnClick="ModeJourNuit_Click" /></div>

On the click action a change the value of the cookie On the load_page action I add the css link like below

ModDayNightUserControl.ascx.cs

if (cookieMode != null && cookieMode.Value == "Nuit")
        {
           SpanModeJourNuit.InnerHtml = "<link href='/_layouts/15/styles/Themable/PortailOperationnel.CharteGraphique/StyleNoirBlancVert.css'  type='text/css' rel='Stylesheet'/>";
            }

The time that the load_page action of the userCustomControl code is read there is a flash whit screen.

2
  • Are you sure its Sharepoint 2017 because till now I haven't heard of this version. So request you to edit the post. Jun 8, 2017 at 14:11
  • Sorry but the tag was correctly 2013
    – Romain
    Jun 8, 2017 at 14:59

1 Answer 1

2

Your white flash is because you apply CSS too late

Add your CSS to the masterpage CSS so it is loaded early on with:

<style id="nightTheme" onload="this.disabled=true">
  ... your styles..
</style>

Then add JS code to activate it:

document.getElementById('nightTheme').disabled=false;

Preferably a UserCustomAction ScriptLink, but at the bottom of the MasterPage will do, so it executes early on

update

Your Custom Control adds the LINK to the page just too late, so your White Theme is displayed.. then it takes milliseconds to seconds to load your CSS file

So you need to add that LINK as early as possible

You only have to do this once (per sitecollection)

Note: Your CSS could be loaded before SharePoint CSS, so you need to set your CSS Specificity right on all selectors so they overrules the later loaded CSS files

This is also the best way to load any JS Library

2
  • Excuse me I didn't give you all the detail see my Edit part. I try using disable in the user control but it's the same, the load_page of the user control is read after that the white screen came back
    – Romain
    Jun 8, 2017 at 12:56
  • updated answers Jun 8, 2017 at 17:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.