如何自定义StoreFront的访问页面——win时间效果
本帖最后由 xiaoyu 于 2018-10-17 17:29 编辑效果：访问Stoefront效果
一、进入C:\inetpub\wwwroot\Citrix\***Web\custom记事本打开Style.css，底部添加代码：
.web-screen {
background-image: url();
background-color: rgb(0, 91, 139);
}
.web-screen .content-area{
background-color: rgb(0, 91, 139);
margin-top: 50px;
padding: 10px 0;
}
.logon-area {
display: table;
width: 100%;
}
.credentialform .buttonsrow {
padding-top: 7px;
}
/*.credentialform .buttonsrow {
padding-top: 7px;
}*/
/*.credentialform .buttonscontainer {
width: 285px;
border: 1px solid white;
}*/
.vertical-center-outer {
display: table;
width: 100%;
height: 80%;
}
.credentialform {
width: 760px;
background-image: url("./zzlogo.png");
background-repeat: no-repeat;
height: 200px;
}
/*.credentialform .field .left {
float: right;
display: none;
}*/
.credentialform .field .left {
position: relative;
left: 320px;
}
.credentialform .field .left h1{
position: relative;
left: 180px;
}
.credentialform .plain {
display: none;
}
.logon-logo-container {
background-image: url("");
}
.button.default{
background-color: #02a1c1;
color: #FFFFFF;
/*zi ti yan se */
border-style: solid;
border-color: #02a1c1;
border-width: 4px;
}
.credentialform .buttonscontainer {
width: 285px;
}
.credentialform.right{
width: 285px;
font-size: 16px;
background-color: #366;
}
.credentialform input, .credentialform input, .credentialform .pseudo-input {
width: 285px;
font-size: 16px;
color: #666;
}
二、拷贝zzlogo.jpg图片（Logo图片）C:\inetpub\wwwroot\Citrix\***Web\custom下
三、打开C:\inetpub\wwwroot\Citrix\***Web\customweb\css\style.css
.yuzhibangtime1{
font-family: "Arial";
font-size:100px;
color: #FFFFFF;
margin-left:55px;
}
.yuzhibangtime2{
font-family: "Microsoft YaHei UI";
font-size:40px;
color: #FFFFFF;
margin-left:55px;
}
四、编辑C:\inetpub\wwwroot\Citrix\***Web\receiver.html
1、<head></head>中间增加
<script type="text/javascript" src="customweb/js/script2.js"></script>
<link href="customweb/css/style.css" rel="stylesheet" type="text/css">
2、查找<div id="pluginExplicitAuthFooter" class="pluginAuthFooter"> ，在紧跟上方增加
<div class="yuzhibangtime1" id="clock"></div>
<script type="text/javascript">tick()</script>
<script type="text/javascript">
document.write("<div class='yuzhibangtime2'>"+ isnMonths +"月"+ today.getDate() +"日,"+ isnDays +"</div>");setInterval(function(){document.getElementById("username").setAttribute("placeholder","用户名");}, 2000);
setInterval(function(){document.getElementById("password").setAttribute("placeholder","密码");}, 2000);setInterval(function(){document.getElementById("oldPassword").setAttribute("placeholder","旧密码");},2000 );
setInterval(function(){document.getElementById("newPassword").setAttribute("placeholder","新密码");}, 2000);
setInterval(function(){document.getElementById("confirmPassword").setAttribute("placeholder","确认密码");}, 2000);
</script>
五、修改C:\inetpub\wwwroot\Citrix\***Web\receiver\css\ctxs.large-ui.min_62D11B01D15101DA.css (主要是减小输入框的宽度，以前为385px，更改为285px)
1、查找.credentialform .pseudo-input{width:385px;font-size:16px;color:#666}.更改为.credentialform .pseudo-input{width:285px;font-size:16px;color:#666}.
2、查找.credentialform .buttonscontainer{width:385px} 更改为.credentialform .buttonscontainer{width:285px}
六、将附件script2.js文件放入C:\inetpub\wwwroot\Citrix\***Web\customweb\js\路径下
function showLocale(obj){
var str;
var hh = obj.getHours();
if(hh<10)
hh = '0' + hh;
var mm = obj.getMinutes();
if(mm<10) mm = '0' + mm;
str = hh + ":" + mm ;
return(str);
}
function tick(){
var today;
today = new Date();
document.getElementById("clock").innerHTML = showLocale(today);
window.setTimeout("tick()", 3000);
}
function initArray(){
for(i=0;i<initArray.arguments.length;i++)
this=initArray.arguments;
}
var isnMonths=new initArray("1","2","3","4","5","6","7","8","9","10","11","12");
var isnDays=new initArray("星期日","星期一","星期二","星期三","星期四","星期五","星期六","星期日");
today=new Date();
hrs=today.getHours();
min=today.getMinutes();
sec=today.getSeconds();
clckh=""+((hrs>12)?hrs-12:hrs);
clckm=((min<10)?"0":"")+min;clcks=((sec<10)?"0":"")+sec;
clck=(hrs>=12)?"下午":"上午";
var stnr="";
var ns="0123456789";
var a="";
function getFullYear(d){
yr=d.getYear();
if(yr<1000)
yr+=1900;
return yr;
}
页:
[1]