window.onload=function () {
    var video = document.getelementbyid("video_teach");
    // var teach = document.getelementsbyclassname("red_default");
    var news = document.getelementsbyclassname("red_news");

    var boxs = document.getelementsbyclassname("news");

    for (var i = 0; i < news.length; i++) {
        news[i].onmouseover = function() {
            for (var j = 0; j < news.length; j++) {
                news[j].classname = 'red_news';
            }
            const id = this.getattribute('data-id');
            for (var u = 0; u < boxs.length; u++) {
                const boxid = boxs[u].getattribute('data-id');
                if (boxid === id) boxs[u].classname = 'news visible';
                else boxs[u].classname = 'news';
            }
            this.classname = 'red_news selected';
            
            // // video.style.display = "block";
            // this.style.color = "#ff4949";
            // // teach[0].style.color ="black";
        }
    }

    
        var intraduce = document.getelementsbyclassname("intraduce");
        var intraduce2 = document.getelementsbyclassname("intraduce2");
        var intraducepic = document.getelementsbyclassname("intraduce-pic");
        var intraducepic2 = document.getelementsbyclassname("intraduce-pic2");

        intraducepic[0].classlist.add("intraduce-a");
        intraducepic2[0].classlist.add("intraduce-a");

        for(let i=0;i<intraduce.length;i++){
            intraduce[i].onmouseover = function () {
                for(let m=0;m<intraducepic.length;m++){
                    intraducepic[m].classlist.remove("intraduce-a");
                }
                intraducepic[i].classlist.add("intraduce-a");
            };
        }
    for(let i=0;i<intraduce2.length;i++){
        intraduce2[i].onmouseover = function () {
            for(let m=0;m<intraducepic2.length;m++){
                intraducepic2[m].classlist.remove("intraduce-a");
            }
            intraducepic2[i].classlist.add("intraduce-a");
        };
    }
        /*intraduce[0].onmouseover = function () {
            intraducepic[0].style.display = "none";
            intraducepic[1].style.display = "block";
        };
        intraduce[1].onmouseover = function () {
            intraducepic[0].style.display = "block";
            intraducepic[1].style.display = "none";
        };

        intraduce[2].onmouseover = function () {
            intraducepic[2].style.display = "none";
            intraducepic[3].style.display = "block";
        };
        intraduce[3].onmouseover = function () {
            intraducepic[2].style.display = "block";
            intraducepic[3].style.display = "none";
        };

        intraduce[4].onmouseover = function () {
            intraducepic[4].style.display = "none";
            intraducepic[5].style.display = "block";
        };
        intraduce[5].onmouseover = function () {
            intraducepic[4].style.display = "block";
            intraducepic[5].style.display = "none";
        };

        intraduce[6].onmouseover = function () {
            intraducepic[6].style.display = "none";
            intraducepic[7].style.display = "block";
        };
        intraduce[7].onmouseover = function () {
            intraducepic[6].style.display = "block";
            intraducepic[7].style.display = "none";
        };*/
}