caimei365-www/src/main/resources/static/js/encyclopedia/detail.js

"use strict";

function initPreviewImage() {
    var imageGroup = {};
    var imageEls = document.querySelectorAll('.content');
    if (imageEls.length <= 0) return;
    imageEls.forEach(function (imageEl, index) {
        imageGroup['cm-images-' + index] = new Viewer(imageEl);
    });
    console.log('初始化图片预览成功')
}

$(function () {
    // 页面滚动偏移
    var offset = 0;
    var windowWidth = $(window).width();
    var timer = null; // 定时器
    var middleScreenWidth = 1450;
    // 生成导航
    makeNavigate('.section .title h2', '.navigate');
    if (windowWidth > 768) {
        offset = getScrollOffset('.navbar') + 10;
    } else {
        offset = getScrollOffset(['.navbar', '.navigate']) + 10;
    }
    // 侧边导航跳转
    bindCategory('.navigate li', '.section', offset, function (index) {
        activeCategory('.navigate li', index);
    });
    // 页面滚动观测
    pageScrollObserve('.section', offset, function (el, index) {
        if (index > -1) {
            activeCategory('.navigate li', index);
        }
    });
    // 常见问题展开收起
    $('[data-toggle="collapse"]').each(function (index, el) {
        var targetEl = $(el).attr('data-target');
        if (!targetEl) return;
        $(targetEl).hide();
        $(el).on('click', function () {
            $(targetEl).toggle();
            $(el).toggleClass('arrowup');
        });
    });

    $('#contactPopupBtn').on('click', function () {
        $('#contactPopup').show();
    });
    $('#contactPopupClose').on('click', function () {
        $('#contactPopup').hide();
    });

    // 切换显示侧边导航
    function toggleNavigate(selector, time, maxWidth, offset) {
        selector = $(selector);
        if (windowWidth <= middleScreenWidth) {
            selector.hide();
        }
        // 鼠标移动事件
        $('body').on('mousemove', function (e) {
            var width = $(this).width();
            if (!(e.clientX > width - offset && width <= maxWidth)) return;
            clearTimeout(timer);
            selector.fadeIn();
            timer = setTimeout(function () {
                selector.fadeOut();
            }, time)
        });
        // 窗口大小改变
        $(window).resize(function () {
            if ($(this).width() <= maxWidth) {
                selector.hide();
            } else {
                selector.show();
            }
        });
    }
    initPreviewImage()
    // toggleNavigate('.navigate', 1000, middleScreenWidth, 80);
});