1

Video as background

asked 2017-09-14 23:18:38 +0800

smanu00 gravatar image smanu00
13 2

updated 2017-09-15 11:21:57 +0800

cor3000 gravatar image cor3000
3484 1 7
ZK Team

Hello, I would like to play a mp4 video as a background of a page with above the login form. I've implemented the login form but I'm not able to put the video as a background.

This is my code:

borderlayout> // I would like that this borderlayout has a background mp4 video

<borderlayout>

    <north sclass="no-background" height="25%" border="no">
        <hlayout spacing="0">   
            <image src="/icons/logo.jpg" sclass="logo-login"/>
        </hlayout>
    </north>
    <south sclass="no-background" height="35%" border="no"></south>
    <east sclass="no-background" width="35%" border="no"></east>
    <west sclass="no-background" width="35%" border="no"></west>

    <center border="no" sclass="no-background"> 
        <window id="winLogin" sclass="win-login" title="LOGIN" border="normal" apply="fe.composer.LoginComposer"
            width="100%" height="100%">
            <borderlayout  >
                <north border="no" height="20%" sclass="padding-top-in-window">
                    <label id="labelInfo" sclass="label-info" value="Inserisci username e password per accedere"/>
                </north>
                <south border="no" height="10%"></south>
                <west border="no" width="10%"></west>
                <east border="no" width="0%"></east>
                <center border="no" >

                    <grid sclass="grid-login no-background" width="100%">
                        <columns>
                            <column width="8%"/><column/>
                            <column width="50%"/><column/>
                        </columns>
                        <rows>
                            <row>
                                <image src="/icons/user-black.png" sclass="icon-dim"/>
                                <label id="labelUser" value="Username:"/>    
                                <textbox id="uname" hflex="1" />
                            </row>
                            <row>
                                <image src="/icons/password-black.png" sclass="icon-dim"/>
                                <label id="labelPass" value="Password:"/>    
                                <textbox id="upwd" type="password" forward="" hflex="1"/>
                            </row>
                            <row spans="3" align="right">
                                <button id="btnLogin" label="Login" width="80px" mold="trendy"/>        
                            </row>
                        </rows>
                    </grid>

                </center>
            </borderlayout>
        </window>
    </center>

</borderlayout>
delete flag offensive retag edit

2 Answers

Sort by ยป oldest newest most voted
0

answered 2017-09-27 15:41:24 +0800

hawk gravatar image hawk
2028 1 5
http://hawkphoenix.blogsp... ZK Team

ZK doesn't have a video component, so you have to put a native HTML <video> in a zul. To put HTML tag in a zul, you have to declare a native namespace (https://www.zkoss.org/wiki/ZUML_Reference/ZUML/Namespaces`) To put a video as a background, please refer to http://thenewcode.com/777/Create-Fullscreen-HTML5-Page-Background-Video

link publish delete flag offensive edit
0

answered 2017-09-27 16:49:57 +0800

smanu00 gravatar image smanu00
13 2

Thanks a lot hawk!!!

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
2 followers

RSS

Stats

Asked: 2017-09-14 23:18:38 +0800

Seen: 17 times

Last updated: Sep 27