zoukankan      html  css  js  c++  java
  • 哈佛大学官网图标下拉变小代码

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="textml; charset=utf-8" />
    <title>无标题文档</title>

    <style type="text/css">
    *{ margin:0px auto; padding:0px; font-family:微软雅黑; font-size:14px;}

    #aa{ 100%; height:50px; background-color:#66C; margin-top:0px;}
    </style>

    </head>
    <body>

    <div id="aa">

    </div>

    <div style="100px; height:1000px"></div>

    </body>
    <script type="text/javascript">

    //取出DIV相对于页面上方的距离
    var p = document.getElementById("aa").offsetTop;

    //窗体的滚动事件
     window.onscroll = function () {
      
      //取出当前页面的滚动距离
      var t = document.documentElement.scrollTop || document.body.scrollTop;
      if(t>p)
      {
      document.getElementById("aa").style.position = "fixed";
      document.getElementById("aa").style.width = "500px";
      document.getElementById("aa").style.height = "20px";
      }
      else if(t==p)
      {
      document.getElementById("aa").style.position = "fixed";
      document.getElementById("aa").style.width = "100%";
      document.getElementById("aa").style.height = "50px";
      }
     
     }

    </script>
    <html>

















  • 相关阅读:
    白话https
    网络分层体系结构
    软件度量
    【Java】itext根据模板生成pdf(包括图片和表格)
    【java】Freemarker 动态生成word(带图片表格)
    压力测试-接口关联
    压力测试-录制脚本
    jmeter性能测试2:基础功能介绍
    jmeter性能测试1:目录解析
    桃花运
  • 原文地址:https://www.cnblogs.com/sq45711478/p/5905004.html
Copyright © 2011-2022 走看看