locked
How to add a static banner to the Lightswitch HTML Homescreen? RRS feed

  • Question

  • I want to add a static banner image into my lightswitch HTML home screen, and this image can automatically resize/stretch based on the browser.

    Is there any article or example about this issue?

    Thanks for your help.

    Monday, June 10, 2013 2:45 PM

Answers

  • Put some code like this in your main screen's 'created' function:

    myapp.Main.created = function (screen) {
            //target: <div class="msls-header-area"></div>
            var headerAreas = document.getElementsByClassName("msls-header-area");
            headerArea = headerAreas.item(0);
            headerArea.parentNode.insertAdjacentHTML(
                "afterBegin", "<div style='background: #ffffff; font-family: Webdings; font-size: 48pt; text-align: center;'>L I G H T S W I T C H</div>")
        });
    };

    I have split the javascript out for this sample.

    Replace the inserted HTML by whatever you want for you banner. The new DIV will rest at the top of the page and stretch across the whole page width by default.

    Cheers

    Dave

    Look something like this:


    Dave Baker | Xpert360 blog | twitter : @xpert360 | Xpert360 website Opinions are my own. For better forums, please mark as helpful/answer, if it helps/solves your problem.


    • Edited by Xpert360 Thursday, June 13, 2013 3:39 PM
    • Marked as answer by Little_1991 Thursday, June 13, 2013 4:39 PM
    Thursday, June 13, 2013 3:36 PM

All replies