add script file bottom zul

answered 2017-03-28 13:17:56 +0800

Darksu
1991 ● 1 ● 4

Hello ongdv1208,

Please find below a sample that i made using zhtml:

<zk:zk  xmlns="native" xmlns:x="xhtml" xmlns:sh="shadow" xmlns:zk="zk" xmlns:z="zul">
<x:html lang="en">

<x:head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
   <meta name="description" content="Bootstrap Admin App + jQuery">
   <meta name="keywords" content="app, responsive, jquery, bootstrap, dashboard, admin">
   <title>FlexReporter</title>
   <!-- =============== VENDOR STYLES ===============-->
   <!-- FONT AWESOME-->
   <link rel="stylesheet" href="../vendor/fontawesome/css/font-awesome.min.css">
   <!-- SIMPLE LINE ICONS-->
   <link rel="stylesheet" href="../vendor/simple-line-icons/css/simple-line-icons.css">
   <!-- ANIMATE.CSS-->
   <link rel="stylesheet" href="../vendor/animate.css/animate.min.css">
   <!-- WHIRL (spinners)-->
   <link rel="stylesheet" href="../vendor/whirl/dist/whirl.css">
   <!-- =============== PAGE VENDOR STYLES ===============-->
   <!-- WEATHER ICONS-->
   <link rel="stylesheet" href="../vendor/weather-icons/css/weather-icons.min.css">
   <!-- =============== BOOTSTRAP STYLES ===============-->
   <link rel="stylesheet" href="css/bootstrap.css" id="bscss">
   <!-- =============== APP STYLES ===============-->
   <link rel="stylesheet" href="css/app.css" id="maincss">

   <link rel="shortcut icon" href="http://sstatic.net/stackoverflow/img/favicon.ico">
</x:head>

<x:body viewModel="@id('vm') @init('sample')">
   <div class="wrapper">      
   </div>   
   <script src="js/app.js"></script>
</x:body>

</x:html>
</zk:zk>

Best Regards,

Darksu

answered 2017-03-29 05:55:47 +0800

Darksu
1991 ● 1 ● 4

Hello ongdv1208,

Can you post your script so i can check it out? And keep in mind the file extension should be zhtml.

Best Regards,

Darksu

answered 2017-03-28 07:25:58 +0800

Darksu
1991 ● 1 ● 4

Hello ongdv1208,

So basically there are two options:

1. Bind the javascript with a component that is at the bottom of the page.
2. Use javascript/jquery to calculate where the bottom is and make appropriate actions.

Ref: http://stackoverflow.com/questions/16260498/push-footer-to-bottom-when-page-is-not-full

Best Regards,

Darksu