manHourHousekeeper/fhKeeper/formulahousekeeper/inva_4_tivo/js/index.js

// 产品鼠标移入移出
let fls = true
$('#productHov').hover(function () {$("#product").show()},function () {
    setTimeout(function() {
        if(fls) {
            $("#product").hide()
        }
    }, 200)
})
$('#product').hover(function () {
    fls = false
    $("#product").show()
},function () {
    fls = true
    $("#product").hide()
})

// 导航下划线
$('.aus li').hover(function () {
    let i = $(this).index()
    $(".aus li").eq(i).addClass('tils')
},function () {
    let i = $(this).index()
    $(".aus li").eq(i).removeClass('tils')

})

$('.auss li').hover(function () {
    let i = $(this).index()
    $(".auss li").eq(i).addClass('tils')
},function () {
    let i = $(this).index()
    $(".auss li").eq(i).removeClass('tils')
})

// 智能系统管家模块的js效果
let screenHeight = $(window).height()
// 系统智能的高度
let jiesaoTop = $('.jiesao').offset().top
 
// 智能引擎的高度
let znyqTop = $('.znyq').offset().top

let fill = $('.fill').offset().top
let znyq = $('.znyq').offset().top
console.log(znyq, '高度')
let jiesao = $('.jiesao').offset().top
let tooltipsOffTop = $('#pricing').offset().top
let filss = ''
let znyqss = ''
let jiesaoss = ''
let tooltips = ''
var devicewidth = document.documentElement.clientWidth
if(document.documentElement.clientWidth < 1900) {
    var scale = devicewidth / 1920
    filss = fill * scale
    znyqss = znyq * scale
    jiesaoss = jiesao * scale
    tooltips = tooltipsOffTop * scale
} else {
    filss = fill
    tooltips = tooltipsOffTop
}

$(window).scroll(function () {
    // 当前滚动的高度
    let currentTop = $(window).scrollTop()
    if(currentTop < 2) { 
        $('#all').removeClass('hanAll')
        $('#abc').addClass('abc')
        $("#loGo").attr("src", './image/logo.png')
    } else {
        $("#all").addClass("hanAll");
        $("#abc").removeClass("abc");
        $("#loGo").attr("src", './image/logo.jpg')
    }
    // // 系统管理滚动计算
    // if (currentTop > jiesaoTop && currentTop < (jiesaoTop + screenHeight)) {
    //     let jiesaoopacity = (currentTop - jiesaoTop) / screenHeight
    //     // let jiesaopadding = (1 - jiesaoopacity) * 300 + 'px'
    //     let jieMIngcs = jiesaoopacity > 0.8 ? jiesaoopacity : '0'
    //     // 文字加透明
    //     $('#manConDDp1').css({'opacity': jieMIngcs})
    //     $('#manConDDp2').css({'opacity': jieMIngcs})
    //     $('#manConDDp3').css({'opacity': jieMIngcs})
    //     $('#manConDDp4').css({'opacity': jieMIngcs})
    //     $('#manConDDp5').css({'opacity': jieMIngcs})
    //     $('#manConDDp6').css({'opacity': jieMIngcs})
    //     $('#manConDDp7').css({'opacity': jieMIngcs})
    //     // 偏移
    //     // $('#manConDD1').css({'transform': `translate(0, ${(1 - jiesaoopacity) * 293}px)`})
    //     // $('#manConDD2').css({'transform': `translate(-${(1 - jiesaoopacity) * 362}px, ${(1 - jiesaoopacity) * 123}px)`})
    //     // $('#manConDD3').css({'transform': `translate(-${(1 - jiesaoopacity) * 362}px, -${(1 - jiesaoopacity) * 141}px)`})
    //     // $('#manConDD4').css({'transform': `translate(-${(1 - jiesaoopacity) * 162}px, -${(1 - jiesaoopacity) * 339}px)`})
    //     // $('#manConDD5').css({'transform': `translate(${(1 - jiesaoopacity) * 162}px, -${(1 - jiesaoopacity) * 339}px)`})
    //     // $('#manConDD6').css({'transform': `translate(${(1 - jiesaoopacity) * 362}px, -${(1 - jiesaoopacity) * 141}px)`})
    //     // $('#manConDD7').css({'transform': `translate(${(1 - jiesaoopacity) * 362}px, ${(1 - jiesaoopacity) * 123}px)`})

    //     $('#manConDD1').css({'transform': `translate(0, ${(1.1 - jiesaoopacity) * 300}px)`})
    //     $('#manConDD2').css({'transform': `translate(-${(1 - jiesaoopacity) * 362}px, ${(1 - jiesaoopacity) * 123}px)`})
    //     $('#manConDD3').css({'transform': `translate(-${(1 - jiesaoopacity) * 362}px, -${(1 - jiesaoopacity) * 141}px)`})
    //     $('#manConDD4').css({'transform': `translate(-${(1 - jiesaoopacity) * 162}px, -${(1.1 - jiesaoopacity) * 339}px)`})
    //     $('#manConDD5').css({'transform': `translate(${(1 - jiesaoopacity) * 162}px, -${(1.1 - jiesaoopacity) * 339}px)`})
    //     $('#manConDD6').css({'transform': `translate(${(1 - jiesaoopacity) * 362}px, -${(1 - jiesaoopacity) * 141}px)`})
    //     $('#manConDD7').css({'transform': `translate(${(1 - jiesaoopacity) * 362}px, ${(1 - jiesaoopacity) * 123}px)`})
    // }
    // 智能引擎滚动计算
    // if(currentTop > znyqTop && currentTop < (znyqTop + screenHeight) && currentTop < 3000) {
    //     let znyqTopopacity = (2900 - currentTop)
    //     let znyqToppadding = (znyqTopopacity - 1) * 1.15 + 'px'
    //     $('#znyqH').css({'transform':'translate(0,'+znyqToppadding+')'})
    // }
    // if(currentTop > znyqTop && currentTop < (znyqTop + screenHeight)) {
    //     let teamOffset = (currentTop - znyqTop) / screenHeight
    //     $('#znyqH').css({'transform':`translate(0, ${(1 - teamOffset) * 260}px)`})
    // }
    // if(currentTop > znyqTop && currentTop < (znyqTop + screenHeight + 800) && currentTop > 2900) {
        // if(currentTop > znyqTop && currentTop < (znyqTop + screenHeight + 800) && currentTop > 2900) {
    //     let znyqTopopacityVal = (currentTop - znyqTop) / (screenHeight + 800)
    //     // 550的
    //     let znyqToppaddingfives = (1 - znyqTopopacityVal) * 550 + 'px'
    //     // 500的
    //     let znyqToppaddingfive = (1 - znyqTopopacityVal) * 500 + 'px'
    //     // 400的
    //     let znyqToppaddingfour = (1 - znyqTopopacityVal) * 400 + 'px'
    //     // 300的
    //     let znyqToppaddingthree = (1 - znyqTopopacityVal) * 300 + 'px'
    //     if(znyqTopopacityVal < 0.2) znyqTopopacityVal = 0
    //     $('#selMou1').css({'opacity': znyqTopopacityVal, 'transform':'translate(-'+znyqToppaddingfive+',-'+ znyqToppaddingfive +')'})
    //     $('#selMou2').css({'opacity': znyqTopopacityVal, 'transform':'translate(-'+znyqToppaddingfour+',-'+ znyqToppaddingfour +')'})
    //     $('#selMou3').css({'opacity': znyqTopopacityVal, 'transform':'translate(-'+znyqToppaddingfive+','+ znyqToppaddingfive +')'})
    //     $('#selMou4').css({'opacity': znyqTopopacityVal, 'transform':'translate(-'+znyqToppaddingfour+','+ znyqToppaddingfour +')'})

    //     $('#selMour1').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingthree+',-'+ znyqToppaddingthree +')'})
    //     $('#selMour2').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingfour+',-'+ znyqToppaddingfour +')'})
    //     $('#selMour3').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingfive+',-'+ znyqToppaddingfive +')'})
    //     $('#selMour4').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingfives+',-'+ znyqToppaddingfives +')'})
    //     $('#selMour5').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingthree+','+ znyqToppaddingthree +')'})
    //     $('#selMour6').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingfour+','+ znyqToppaddingfour +')'})
    //     $('#selMour7').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingfive+','+ znyqToppaddingfive +')'})
    //     $('#selMour8').css({'opacity': znyqTopopacityVal, 'transform':'translate('+znyqToppaddingfives+','+ znyqToppaddingfives +')'})
    // }
    // 加样式 （填报、审批、统计分分钟搞定）
    if(currentTop > filss - 300) {
        $('#fillCon').addClass('fillCons')
    }
    if(currentTop < filss - 400){
        $("#fillCon").removeClass("fillCons");
    }

    // 加样式 （产品定价）
    if(currentTop > tooltips - 500) {
        $('#tooltipTis').addClass('tooltipTisFillCons')
    }
    if(currentTop < tooltips - 800){
        $("#tooltipTis").removeClass("tooltipTisFillCons");
    }

})

// tab点击
$(function() {
    $('#tablTabUl li').click(function() {
        let index = $(this).index()
        var arr = $('#tablTabUl li')
        for(var i in arr) {
            $('#tablTabUl li').eq(i).find('img').attr("src", './image/ions/'+ (+i + 1)+'.1.png')
            $('#tablTabUl li').removeClass('tabOn')
        }
        $(this).addClass("tabOn")
        $(this).find('img').attr("src", './image/ions/'+(+index + 1)+'.png')
        $('#finImg').attr("src", './image/gs'+(+index + 1)+'.jpg')
    })
})

// 客服hover
$('#zhixun').hover(function () {
    $("#zhixun").show()
    $("#consultigImg").attr("src", './image/ions/kefu1.png')
},function () {
    $("#zhixun").hide()
    $("#consultigImg").attr("src", './image/ions/kefu2.png')
})
$('#consulting').hover(function () {
    $("#zhixun").show()
    $("#consultigImg").attr("src", './image/ions/kefu1.png')
},function () {
    $("#zhixun").hide()
    $("#consultigImg").attr("src", './image/ions/kefu2.png')
})

let nums = 0
let mobiledistance = 0
// 客户点击
$(function() {
    kehuFlg()
    $('#kehuLeft').click(function() {
        if(nums > 0 && nums <= 6) {
            nums--
            zuoyouClick()
        }
    })
    $('#kehuRight').click(function() {
        if(nums < 6) {
            nums++
            zuoyouClick()
        }
    })
})

function zuoyouClick() {
    mobiledistance = '-' + (nums * 510) + 'px'
    $('.conImg').stop(true,false).animate({
        'left': mobiledistance
    }, 400)
    kehuFlg()
}

function kehuFlg() {
    if(nums == 0) {
        $('#kehuLeft').find('img').attr("src", './image/ions/zuos.png')
        $('#kehuLeft').addClass("zhis")
    } else {
        $('#kehuLeft').find('img').attr("src", './image/ions/zuo.png')
        $('#kehuLeft').removeClass("zhis")
    }
    if(nums >= 6) {
        $('#kehuRight').find('img').attr("src", './image/ions/yous.png')
        $('#kehuRight').addClass("zhis")
    } else {
        $('#kehuRight').find('img').attr("src", './image/ions/you.png')
        $('#kehuRight').removeClass("zhis")
    }
} 

// 新的动画效果
function gdjz(div,cssname,offset){
	var a,b,c,d;
	d=$(div).offset().top;
	a=eval(d + offset);
	b=$(window).scrollTop(); 
	c=$(window).height();
	if(b+c>a){
	    $((div)).addClass((cssname));
        $('#manConDDp1').css('opacity', 1)
        $('#manConDDp2').css('opacity', 1)
        $('#manConDDp3').css('opacity', 1)
        $('#manConDDp4').css('opacity', 1)
        $('#manConDDp5').css('opacity', 1)
        $('#manConDDp6').css('opacity', 1)
        $('#manConDDp7').css('opacity', 1)
	}
}

function znyqFun(div,cssname,offset){
	var a,b,c,d;
	d=$(div).offset().top;
	a=eval(d + offset);
	b=$(window).scrollTop(); 
	c=$(window).height();
	if(b+c>a){
	    $((div)).addClass((cssname));
	}
}
$(document).ready(function(e) {
    $(window).scroll(function(){
        for (i = 0; i < 7; i++) {
            if(i == 0) {gdjz("#manConDD1",'manConOne', jiesao - 700)}
            if(i == 1) {gdjz("#manConDD2",'manConTwo', jiesao - 700)}
            if(i == 2) {gdjz("#manConDD3",'manConThree', jiesao - 700)}
            if(i == 3) {gdjz("#manConDD4",'manConfour', jiesao - 700)}
            if(i == 4) {gdjz("#manConDD5",'manConFive', jiesao - 700)}
            if(i == 5) {gdjz("#manConDD6",'manConSix', jiesao - 700)}
            if(i == 6) {gdjz("#manConDD7",'manConSeven', jiesao - 700)}
         }
        for (j = 0; j < 12; j++) {
            if(j == 0) {setTimeout(() => {znyqFun("#selMou1",'selZhui1', znyq - 1200 )}, 0)}
            if(j == 1) {setTimeout(() => {znyqFun("#selMou2",'selZhui2', znyq - 1200 )}, 100)}
            if(j == 2) {setTimeout(() => {znyqFun("#selMou3",'selZhui3', znyq - 2300 )}, 200)}
            if(j == 3) {setTimeout(() => {znyqFun("#selMou4",'selZhui4', znyq - 2200 )}, 300)}
            if(j == 4) {setTimeout(() => {znyqFun("#selMour1",'MourZhui1', znyq - 1200 )}, 400)}
            if(j == 5) {setTimeout(() => {znyqFun("#selMour2",'MourZhui2', znyq - 1200 )}, 500)}
            if(j == 6) {setTimeout(() => {znyqFun("#selMour3",'MourZhui3', znyq - 1200 )}, 600)}
            if(j == 7) {setTimeout(() => {znyqFun("#selMour4",'MourZhui4', znyq - 1200 )}, 700)}
            if(j == 8) {setTimeout(() => {znyqFun("#selMour5",'MourZhui5', znyq - 2200 )}, 800)}
            if(j == 9) {setTimeout(() => {znyqFun("#selMour6",'MourZhui6', znyq - 2200 )}, 900)}
            if(j == 10) {setTimeout(() => {znyqFun("#selMour7",'MourZhui7', znyq - 2300 )}, 1000)}
            if(j == 11) {setTimeout(() => {znyqFun("#selMour8",'MourZhui8', znyq - 2300 )}, 1100)}
        }
    });
});