148 lines
5.4 KiB
JavaScript
148 lines
5.4 KiB
JavaScript
|
$(function(){
|
|||
|
|
if($(window).scrollTop()>10){
|
|||
|
|
a()
|
|||
|
|
}else{
|
|||
|
|
b();
|
|||
|
|
}
|
|||
|
|
$(window).scroll(function () {
|
|||
|
|
if($(window).scrollTop()>10){
|
|||
|
|
a()
|
|||
|
|
}else{
|
|||
|
|
b();
|
|||
|
|
}
|
|||
|
|
if($(window).scrollTop()>300&&$(window).scrollTop()<400){
|
|||
|
|
// 基于准备好的dom，初始化echarts实例
|
|||
|
|
var myChart = echarts.init(document.getElementById('canvas'));
|
|||
|
|
|
|||
|
|
// 指定图表的配置项和数据
|
|||
|
|
option = {
|
|||
|
|
title: {
|
|||
|
|
text: '折线图堆叠'
|
|||
|
|
},
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
data:['微信开发','微信开发','微信开发','微信开发']
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '3%',
|
|||
|
|
right: '4%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
toolbox: {
|
|||
|
|
feature: {
|
|||
|
|
saveAsImage:{show:false}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
boundaryGap: false,
|
|||
|
|
data: ['2013','2014','2015','2016']
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value'
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
// name:'微信开发',
|
|||
|
|
type:'line',
|
|||
|
|
symbol:'circle',
|
|||
|
|
symbolSize:12,
|
|||
|
|
stack: '总量',
|
|||
|
|
itemStyle : {
|
|||
|
|
normal : {
|
|||
|
|
color:'#4b5a77',
|
|||
|
|
lineStyle:{
|
|||
|
|
color:'#4b5a77'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data:[350, 460, 470, 549]
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 使用刚指定的配置项和数据显示图表。
|
|||
|
|
myChart.setOption(option);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
function a(){
|
|||
|
|
$(".head").css({
|
|||
|
|
"background":"#fff",
|
|||
|
|
"border-bottom":"1px solid #cfcfcf"
|
|||
|
|
});
|
|||
|
|
$(".head_left ul li a").css({
|
|||
|
|
"color":"#717171"
|
|||
|
|
});
|
|||
|
|
$(".head_right ul li").css({
|
|||
|
|
"color":"#749dd6"
|
|||
|
|
})
|
|||
|
|
$(".head_right ul li span").css({
|
|||
|
|
"color":"#749dd6"
|
|||
|
|
})
|
|||
|
|
$(".jzfw").css({"color":"#749dd6"})
|
|||
|
|
$(".head_list a").hover(
|
|||
|
|
function () {
|
|||
|
|
$(this).css({"color":"#fff"});
|
|||
|
|
},
|
|||
|
|
function () {
|
|||
|
|
$(this).css({"color":"#999"});
|
|||
|
|
$(".jzfw").css("color","rgb(116, 157, 214)")
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
$(".head_select").addClass("a");
|
|||
|
|
$(".head_select a").css("color","#fff");
|
|||
|
|
$(".head_select .app").css("color","#749DD6");
|
|||
|
|
$(".head_selects_fx").addClass("a");
|
|||
|
|
$(".head_select li").hover(
|
|||
|
|
// function () {
|
|||
|
|
// $(this).find("a").css({"color":"rgb(116, 157, 214)"});
|
|||
|
|
// },
|
|||
|
|
function () {
|
|||
|
|
$(this).find("a").css({"color":"#fff"});
|
|||
|
|
$(".app").css({"color":"rgb(116, 157, 214)"});
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
function b(){
|
|||
|
|
$(".head").css({
|
|||
|
|
"background":"transparent",
|
|||
|
|
"border-bottom":"0"
|
|||
|
|
});
|
|||
|
|
$(".head_left ul li a").css({
|
|||
|
|
"color":"#c4ddff"
|
|||
|
|
});
|
|||
|
|
$(".head_right ul li").css({
|
|||
|
|
"color":"#fff"
|
|||
|
|
})
|
|||
|
|
$(".head_right ul li span").css({
|
|||
|
|
"color":"#fff"
|
|||
|
|
})
|
|||
|
|
$(".jzfw").css({"color":"#fff"});
|
|||
|
|
|
|||
|
|
$(".head_list a").hover(
|
|||
|
|
function () {
|
|||
|
|
$(this).css({"color":"#fff"});
|
|||
|
|
},
|
|||
|
|
function () {
|
|||
|
|
$(this).css({"color":"#c4ddff"});
|
|||
|
|
$(".jzfw").css("color","#fff")
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
$(".head_select").removeClass("a");
|
|||
|
|
$(".head_select a").css("color","rgb(196, 221, 255)");
|
|||
|
|
$(".head_select .app").css("color","#fff");
|
|||
|
|
$(".head_selects_fx").removeClass("a");
|
|||
|
|
// $(".head_select li").hover(
|
|||
|
|
// function () {
|
|||
|
|
// $(this).find("a").css({"color":"#fff"});
|
|||
|
|
// },
|
|||
|
|
// function () {
|
|||
|
|
// // $(this).find("a").css({"color":"#C4DDFF"});
|
|||
|
|
// // $(".app").css({"color":"#fff"});
|
|||
|
|
// }
|
|||
|
|
// );
|
|||
|
|
}
|