js jquery效果

onload事件

 window.onload = function () {}

图片缓慢放大动画过渡

 $(".title").css({"transform": "scale(1.1)","transition": "all 4.0s"});

图片预加载

    var images = new Array();
      function preload() {
        for (i = 0; i < preload.arguments.length; i++) {
          images[i] = new Image();
          images[i].src = preload.arguments[i];
        }
      }
      preload(
        "images/pic1.png",
        "images/pic2.png", 
      );
    </script>

滚动动画

    function aa() {
        scroll = window.scrollY
        $(".msg").animate({ height: "" + (scroll - 100) + "px" }, 10);
        window.requestAnimationFrame(aa);
      }
      window.requestAnimationFrame(aa);

滚动条的值

//获取滚动条的值
        window.onscroll = function () {
        //获取滚动条的值

        var scrollPos;

        if (typeof window.pageYOffset != "undefined") {
          //window.pageYOffset是NS专用属性，它的含义和IE下的document.body.scrollTop一样

          scrollPos = window.pageYOffset;
        }

        //当前浏览器采用的渲染方式。
        //主要是浏览器的模式，有两个：BackCompat，CSS1Compat。其中前者是怪异模式，后者是标准模式。
        //IE默认是BackCompat模式，Gecko内核的浏览器只在table中图片层上不同，可以看为CSS1Compat标准模式
        //document.compatMode等于BackCompat时，浏览器客户区宽度是document.body.clientWidth；
        //当document.compatMode等于CSS1Compat时，浏览器客户区宽度是document.documentElement.clientWidth。
        //浏览器客户区高度、滚动条高度、滚动条的Left、滚动条的Top等等都是上面的情况。
        else if (
          typeof document.compatMode != "undefined" &&
          document.compatMode != "BackCompat"
        ) {
          scrollPos = document.documentElement.scrollTop;
        } else if (typeof document.body != "undefined") {
          scrollPos = document.body.scrollTop;
        }

        // document.getElementById("divtest").innerHTML =
        //   scrollPos + ";渲染模式" + document.compatMode;
        const imgCount = 65;
        const maxScrollTop =
          document.documentElement.scrollHeight - window.innerHeight;

        const scrollFraction = scrollPos / maxScrollTop;
        const index = Math.min(
          imgCount - 1,
          Math.ceil(scrollFraction * imgCount)
        );
        console.log(
          scrollPos,
          document.compatMode,
          maxScrollTop,
          scrollFraction,
          index
        );
      };
      
      
       let a = document.documentElement.scrollTop;

 var arr = {
      'en': {
        'langcn': '中文',
        'langen': '英语',
      },
      'cn': {
        'langcn': 'chinese',
        'langen': 'english',
      },

    };

多个div点击，类名.click

  
      // for (var i = 1; i <= 20; i++) {
      //   $(".brief" + i + "").click(function () {
      //     $('#dialogBox2 img').attr("src", "img" + i + ".png")
      //   })
      // }
      $(".brief").click(function (e) {
       
       console.log(e.currentTarget.getAttribute("index"));
       var idx=e.currentTarget.getAttribute("index")
       
          $('.tro-img').attr("src","img"+idx+".png")
        
       
      })