Difference between revisions of "Template:UESTC-China/footer"

 
(12 intermediate revisions by the same user not shown)
Line 2: Line 2:
 
<body>
 
<body>
 
<footer  style="background-color: #000000">
 
<footer  style="background-color: #000000">
−
   <div class="row">
+
   <div class="row" style="margin:0">
−
     <div class="col-md-12" style="font-size: 20px; text-align: center;color: #ffffff;line-height:1.5em">Copyright © 2019 iGEM UESTC-China </div>
+
     <div style="font-size: 18px;font-size:1.2vw; text-align: center;color: #ffffff;line-height:1.5em">Copyright © 2019 iGEM UESTC-China </div>
 
   </div>
 
   </div>
−
   <div class="row">
+
   <div class="row" style="margin:0">
 
<img alt="logo" src="https://static.igem.org/mediawiki/2019/5/5d/T--UESTC-China--footer.png" style="width:100%" usemap="#Map" id="imgfoot">  
 
<img alt="logo" src="https://static.igem.org/mediawiki/2019/5/5d/T--UESTC-China--footer.png" style="width:100%" usemap="#Map" id="imgfoot">  
 
  </div>
 
  </div>
 
<map name="Map">
 
<map name="Map">
−
   <area shape="rect" coords="137,30,166,66" href="https://www.facebook.com/uestcchinaigem">
+
   <area shape="rect" coords="203,24,235,51" href="https://www.facebook.com/uestcchinaigem">
−
   <area shape="rect" coords="186,34,226,67" href="https://twitter.com/UESTC_CHINA">
+
   <area shape="rect" coords="251,22,286,51" href="https://twitter.com/UESTC_CHINA">
−
   <area shape="rect" coords="255,33,294,68" href="https://www.weibo.com/u/5983731394">
+
   <area shape="rect" coords="305,25,346,49" href="https://www.weibo.com/u/5983731394">
−
   <area shape="rect" coords="323,11,539,66" href="https://www.uestc.edu.cn/">
+
   <area shape="rect" coords="376,5,562,53" href="https://www.uestc.edu.cn/">
−
   <area shape="rect" coords="554,9,843,72" href="http://www.jwc.uestc.edu.cn/Index.action">
+
   <area shape="rect" coords="578,4,842,49" href="http://www.jwc.uestc.edu.cn/Index.action">
−
   <area shape="rect" coords="859,6,1154,72" href="http://www.life.uestc.edu.cn/">
+
   <area shape="rect" coords="858,6,1114,50" href="http://www.life.uestc.edu.cn/">
 
</map>
 
</map>
 
</footer>
 
</footer>
  
−
<script>
+
<script>//自适应width:100% map标签算法，实际上用正则会简单很多
 
function getxy(target,mult){      
 
function getxy(target,mult){      
 
    var str="";
 
    var str="";
Line 47: Line 47:
 
var $area=$("area");
 
var $area=$("area");
 
var $img=$("#imgfoot");
 
var $img=$("#imgfoot");
−
var _t=$img.width()/1366;//1366为图片原始宽度值
+
var _t=$img.width()/1441;//1441为图片原始宽度值
 
  for(var i=0;i<$area.length;i++){
 
  for(var i=0;i<$area.length;i++){
 
  $area[i].coords=getxy($area[i].coords,_t);
 
  $area[i].coords=getxy($area[i].coords,_t);
Line 65: Line 65:
 
</script>
 
</script>
  
−
<script>//用来配合页面加载完再显示
 
−
$(function(){
 
−
$("#hide").height(20000);//足够大，直接用文档高度有误差
 
−
$("#hide").width($(document).outerWidth(true));//hide 赋值
 
−
})//加载适应长度
 
−
 
−
$(window).resize(function(){//改变屏幕宽度，白板覆盖
 
−
$("#hide").height(20000);
 
−
$("#hide").width($(document).outerWidth(true));
 
−
})
 
−
 
−
window.onload=function(){
 
−
var oHide=document.getElementById("hide");
 
−
oHide.style.display="none";
 
−
}//图片加载完就显示
 
−
 
−
    var oHider=document.getElementById("hider");
 
−
    var scroll=document.body.scrollTop || document.documentElement.scrollTop;
 
−
 
−
    oHider.style.top=scroll+"px"; //这里是定义的行间的top
 
−
    oHider.style.left=document.body.clientWidth/3+"px";//居中
 
−
 
−
window.onscroll=function(){//滚动事件
 
−
    var oHider=document.getElementById("hider");
 
−
    var scroll=document.body.scrollTop || document.documentElement.scrollTop;
 
−
 
−
    oHider.style.top=scroll+"px"; //这里是定义的行间的top
 
−
    oHider.style.left=document.body.clientWidth/3+"px";//居中
 
−
}
 
−
</script>
 
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 04:49, 2 December 2019

Copyright © 2019 iGEM UESTC-China
logo